在标签更改上调用javascript方法

时间:2013-04-16 09:45:29

标签: javascript html

目前正在执行HTML代码以显示标签,如前所述。我想知道每次选项卡更改时我将如何调用函数,因为方法显示不同的数据。每次选项卡更改时,方法都是调用方法box(),当我单击下一个选项卡时,当我返回到该选项卡时,选项卡上的数据会分散,因为选项卡上的数据是使用局部视图添加的在c#

Javascript代码

$(document).ready(function () {
    $('#tabs div').hide(); // Hide all divs
    $('#tabs div:first').show(); // Show the first div
    $('#tabs ul li:first').addClass('active'); // Set the class for active state

    $('#tabs ul li a').click(function () { // When link is clicked
        $('#tabs ul li').removeClass('active'); // Remove active class from links
        $(this).parent().addClass('active'); //Set parent of clicked link class to active
        var currentTab = $(this).attr('href'); // Set currentTab to value of href attribute
        $('#tabs div').hide(); // Hide all divs
        $(currentTab).show(); // Show div with id equal to variable currentTab
        return false;
    });
});

HTML代码

<div id="tabs" style="margin:0px; padding:0px;">
    <br />
    <ul>
        <li class="active">
            <a href="#tab-1">Google Analytics</a>               
        </li>
        <li class="">
            <a href="#tab-2">Facebook</a>
        </li>
        <li class="">
            <a href="#tab-3">YouTube</a>
        </li>
    </ul>   
    <div id="tab1" style="display: block; margin:0px;"></div>
    <div id="tab-2" style="display: none;"></div>
    <div id="tab-3" style="display: none;"></div>
</div>

1 个答案:

答案 0 :(得分:3)

尝试:

$("#tabs").on("click", "li", function(){
  //Your stuff
  //with $(this) is the clicked li
})