javascript - 如何在变量上应用 jquery 函数?

标签 javascript jquery html

我想在 2 个不同的 div 上应用 slimScroll 函数。一次只有一个 div 处于事件状态。 因此,我使用变量来获取当前选项卡名称。当用户单击评论时,slimscroll 应应用于#reviews,如果单击画廊,则应切换到画廊。

html代码:

<ul class="nav nav-pills nav-justified">
   <li class="active"><a href="#reviews" data-toggle="tab">Reviews</a></li>
   <li><a href="#gallery" data-toggle="tab">Gallery</a></li>
</ul><!-- tabs -->
<div class="tab-content">
    <div class="tab-pane active" id="reviews">
        reviews
    </div>
    <div class="tab-pane" id="gallery">
        gallery
    </div>
</div>

jquery 代码:

$(document).ready(function(){
    $('.nav-pills li a').on('click',function(){
        var current = ($(this).text());
        alert(current);
    });
    $('article').slimScroll({
        position: 'right',
        height: '370px',
        railVisible: true,
        alwaysVisible: true
    });
});

最佳答案

这样做:

$(document).ready(function(){
    $('.nav-pills li a').on('click',function(){
        var current = $(this).attr("href").split('#')[1];
        $(this).closest('ul').find('li').removeClass('active');
        $(this).parent().addClass('active');
        //$('div.tab-pane').removeClass('active');
        //$('div#'+current).addClass('active');
        alert(current);

        $('#'+current).slimScroll({
        position: 'right',
        height: '370px',
        railVisible: true,
        alwaysVisible: true
    });

或者:

$(document).ready(function(){
        $('.nav-pills li a').on('click',function(){
            var current = $(this).attr("href").split('#')[1];
            $(this).closest('ul').find('div.tab-content').find('div.tab-pane').removeClass('active');
            $('div#'+current).addClass('active');
            alert(current);

            $('#'+current).slimScroll({
            position: 'right',
            height: '370px',
            railVisible: true,
            alwaysVisible: true
        });

关于javascript - 如何在变量上应用 jquery 函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23052011/

相关文章:

javascript - 启用远程调试 JS 后,无法在 React-Native 应用程序上向 API 发出请求

php - 在 Wordpress 管理仪表板中执行查询

javascript - JQuery 自动建议在搜索一次后不起作用

javascript - 使用 Gmail Apps 脚本以 HTML 和普通格式发送电子邮件

c# - HTML 标签 :label with onclick asp. 网络方法。

html - 等距 DIV 的流体宽度

javascript - 使用自定义 ng 鼠标进入/离开摆脱奇怪的行为

javascript - 如何获取 ng-repeat 上对象属性的项目计数

javascript - 使用 BreezeJS 在 Durandal 中显示模态

jquery - 如何在没有服务器端脚本的情况下在 jquery 移动 html5 中编写可重用代码?