<a> tag doesnt work on the secondtime</a>中的Jquery onclick函数

时间:2015-04-14 05:17:51

标签: javascript jquery html twitter-bootstrap

我正在尝试在点击标签时加载页面,这是一个bootstrap导航栏。它在第一次工作正常。当我第二次点击时,它不起作用,我得到以下错误。

0x800a01b6 - Microsoft JScript运行时错误:对象不支持属性或方法'tab'

我的代码:

<script>
        function alertClick(Id) {

            var selector = $(Id).attr('class').toString();
            $('.' + selector).on('click', function () {

                if (selector == "AlertDiv") {

                    $('#Action1').load("/Home/abc");


                }
                if (selector == "Actiondiv") {

                    $('#Action1').load("/Home/def");
                }

            });

        }
</script>
<style>
    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        color: white;
        cursor: default;
        background-color: rgba(115,139,0,0.8) !important;
        border-top: 1px solid #ddd !important;
        border-right: 1px solid #ddd;
        border-left: 1px solid #ddd;
        border-bottom-color: transparent;
        outline: none;
        font-size: 14px;
    }

    .nav-tabs > li > a {
        margin-right: 5px !important;
        line-height: 1.42857143;
        border: 1px solid transparent !important;
        border-radius: 4px 4px 0 0;   
        color: rgba(115,139,0,0.8) !important;
    }

</style>

<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid" style="float:right;padding-right:100px">


    <div style="border-bottom: 1px solid #ddd;">
        <ul class="nav nav-tabs">
            <li style="border-bottom: 1px solid transparent;">
                <a class="AlertDiv" href="#" onclick="alertClick(this)" data-toggle="tab">
                    Alert heading1

                </a>
            </li>
            <li>
                <a class="Actiondiv" href="#" onclick="alertClick(this)" data-toggle="tab">
                    Action1 heading1
                </a>
            </li>


        </ul>
    </div>
</div>

<div class="container" id="Action1">


</div>
</nav>

1 个答案:

答案 0 :(得分:0)

我认为您可以更改为绑定点击事件,如:

$('ul.nav-tabs > li > a').on('click', function(){
    var selector = $(this).attr('class');
    if (selector == "AlertDiv") {
        alert('AlertDiv');
        //$('#Action1').load("/Home/abc");
    }
    if (selector == "Actiondiv") {
        alert('Action1');
        //$('#Action1').load("/Home/def");
    }
});

fiddle