javascript - 标签中的 Jquery onclick 函数第二次不起作用

Question

我正在尝试通过单击 Bootstrap 导航栏的标签加载页面。第一次使用效果很好。当我第二次点击时，它不起作用，并且出现以下错误。

0x800a01b6 - Microsoft JScript 运行时错误:对象不支持属性或方法“选项卡”

我的代码:

<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>

Answer 1

我认为你可以更改为绑定(bind)点击事件，例如:

$('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