首页 新闻 搜索 专区 学院

js 动态设置A标签href后不跳转问题,求解答,,急急急急急急急急急急急急

0
悬赏园豆:50 [已解决问题] 解决于 2015-12-24 16:49

由于项目需求,项目中都自己重写了消息框,场景:点击A标签,弹出自己重写的消息框, 点击确定的时候动态设置A标签的href属性,然后跳转打开至一新页,,,,,,,值已经设置成功,但是不跳转,我直接用window.confirm()却能跳转成功,求解释(之前用的是window.open但那是很容易出现被拦截的信息,所以也不满足需求),,,
代码如下:

 <a href="javascript:void(0)" id="ss"  target="_blank" >
                    <img src="@icon" />
                </a>

通过点击之后触发:

     $("#ss").click(function(){
var url = "http://www.baidu.com";
                            $.MsgBox.Confirm("提示", "您已经购买过此课程,您是否还需要购买?", function() {
                                $("#ss").attr("href", url);
                            });
}); 

自己重写的弹出框代码如下:

(function () { $.MsgBox = {Confirm: function (title, msg, callback) {
            GenerateHtml("confirm", title, msg);
            btnOk(callback);
            btnNo();
        }
    }
   //生成Html
    var GenerateHtml = function (type, title, msg) {

        var _html = "";

        _html += '<div id="mb_box"></div><div id="mb_con"><span id="mb_tit">' + title + '</span>';
        _html += '<a id="mb_ico">x</a><div id="mb_msg">' + msg + '</div><div id="mb_btnbox">';

        if (type == "alert") {
            _html += '<input id="mb_btn_ok" type="button" value="确定" />';
        }
        if (type == "confirm") {
            _html += '<input id="mb_btn_ok" type="button" value="确定" />';
            _html += '<input id="mb_btn_no" type="button" value="取消" />';
        }
        _html += '</div></div>';

        //必须先将_html添加到body,再设置Css样式
        $("body").append(_html); GenerateCss();
    }

    //生成Css
    var GenerateCss = function () {

        $("#mb_box").css({
            width: '100%', height: '100%', zIndex: '99999', position: 'fixed',
            filter: 'Alpha(opacity=60)', backgroundColor: 'black', top: '0', left: '0', opacity: '0.6'
        });

        $("#mb_con").css({
            zIndex: '999999', width: '400px', position: 'fixed',
            backgroundColor: 'White', borderRadius: '15px'
        });

        $("#mb_tit").css({
            display: 'block', fontSize: '14px', color: '#444', padding: '10px 15px',
            backgroundColor: '#DDD', borderRadius: '15px 15px 0 0',
            borderBottom: '3px solid #009BFE', fontWeight: 'bold'
        });

        $("#mb_msg").css({
            padding: '20px', lineHeight: '20px',
            borderBottom: '1px dashed #DDD', fontSize: '13px'
        });

        $("#mb_ico").css({
            display: 'block', position: 'absolute', right: '10px', top: '9px',
            border: '1px solid Gray', width: '18px', height: '18px', textAlign: 'center',
            lineHeight: '16px', cursor: 'pointer', borderRadius: '12px', fontFamily: '微软雅黑'
        });

        $("#mb_btnbox").css({ margin: '15px 0 10px 0', textAlign: 'center' });
        $("#mb_btn_ok,#mb_btn_no").css({ width: '85px', height: '30px', color: 'white', border: 'none' });
        $("#mb_btn_ok").css({ backgroundColor: '#168bbb' });
        $("#mb_btn_no").css({ backgroundColor: 'gray', marginLeft: '20px' });


        //右上角关闭按钮hover样式
        $("#mb_ico").hover(function () {
            $(this).css({ backgroundColor: 'Red', color: 'White' });
        }, function () {
            $(this).css({ backgroundColor: '#DDD', color: 'black' });
        });

        var _widht = document.documentElement.clientWidth;  //屏幕宽
        var _height = document.documentElement.clientHeight; //屏幕高

        var boxWidth = $("#mb_con").width();
        var boxHeight = $("#mb_con").height();

        //让提示框居中
        $("#mb_con").css({ top: (_height - boxHeight) / 2 + "px", left: (_widht - boxWidth) / 2 + "px" });
    }
//取消按钮事件
    var btnNo = function () {
        $("#mb_btn_no,#mb_ico").click(function () {
            $("#mb_box,#mb_con").remove();
        });
    }
 //确定按钮事件
    var btnOk = function (callback) {
        $("#mb_btn_ok").click(function () {
            $("#mb_box,#mb_con").remove();
            if (typeof (callback) == 'function') { 
                callback();
            }
        });
    }})(); 

直接用window.confirm代码能实现要求

var url = "http://www.baidu.com";
                            if (window.confirm("您已经购买过此课程,您是否还需要购买?")) {
                                $(_self).attr("href", url);
                            }
等待是一生最初的苍老的主页 等待是一生最初的苍老 | 初学一级 | 园豆:3
提问于:2014-12-23 16:37
< >
分享
最佳答案
0

不需要设置原本的a,可以直接

var a = document.createElement('a');

a.setAttribute('href', 'xxx');

a.setAttribute('target', '_blank');

a.click(); 

不兼容IE9,以上。

收获园豆:50
幻天芒 | 高人七级 |园豆:36594 | 2014-12-23 17:28

其实这种方式我也试过,也会当作open的方式,也会有弹出....

等待是一生最初的苍老 | 园豆:3 (初学一级) | 2014-12-23 21:15

@objectboy: 将a加入到body中~

幻天芒 | 园豆:36594 (高人七级) | 2014-12-23 23:22
其他回答(1)
0

你给A标签赋值了,但是没有执行click事件,当然不会跳转了。

Vincent8464 | 园豆:39 (初学一级) | 2014-12-23 19:11

我是在click里面来触发这一些列事情的....

清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册