0

我的页面上有一个元素，我想让它成为可拖动的。

在单击事件中，我添加了“活动”类，这只是扩展了我的 div 和其中的图像。

所以最初我的 div 看起来像......

<div class="work-showcase">

点击它变成...

<div class="work-showcase active">

我想说如果 div 有类活动，执行 X 功能，否则执行 Y。

$(body).click(function(){

        if($('.work-showcase').hasClass('active')){

            var bleft = 4900 ;
            var bright = $(window).width() - 200;

            $('.active > ul li').draggable({
                 axis: "x", 
                 revert: false,
                 stop: function(event, ui) {
                    if(ui.position.left < -bleft)
                    {   
                    $(this).animate({"left": "0px"}, 600);
                    }
                    if(ui.position.left > bright)
                    {   
                    $(this).animate({"left": "0px"}, 600);
                    }

                }
            });


            } else {


     var sleft = 1846 ;
     var sright = $(window).width() - 200;

            $('.work-showcase > ul li').draggable({
                 axis: "x", 
                 revert: false,
                 stop: function(event, ui) {
                    if(ui.position.left < -sleft)
                    {   
                    $(this).animate({"left": "0px"}, 600);
                    }
                    if(ui.position.left > sright)
                    {   
                    $(this).animate({"left": "0px"}, 600);
                    }

                }
            });

        }

    });

我的 If 语句似乎不起作用...

4

3 回答 3

1

试试这个而不是你目前拥有的（如果有问题请告诉我）

$('body').click(function () {
    var drag, left, right;

    if ($('.work-showcase').hasClass('active') === true) {
        drag = '.active > ul li';
        left = -4900;
        right = $(window).width() - 200;
    } else {
        drag = '.work-showcase > ul li';
        left = -1846;
        right = $(window).width() - 200;
    }

    $(drag).draggable({
        axis: 'x',
        revert: false,
        stop: function (event, ui) {
            if (ui.position.left < left) {
                $(this).animate({'left': '0px'}, 600);
            } else if (ui.position.left > right) {
                $(this).animate({'left': '0px'}, 600);
            }
        }
    });
});
于 2013-01-25T16:27:43.510 回答
1

这个选择器：

$(body).click(function(){ ... });

需要是 ：

$('body').click(function(){ ... }

注意引号！

于 2013-01-25T16:28:13.143 回答
0

使用 jQuery：

if($(this).hasClass("active")){
    //do this
} else {
    //do that
}

编辑：它返回true或false：jQuery hasClass Documentation

于 2013-01-25T16:20:07.740 回答