Question

我似乎无法弄清楚的两个小问题：

当您进入该页面时，我允许单击缩略图以转到其他页面。但是，当我点击“删除拇指”按钮时，我不允许用户点击，我使用防止默认。现在我的问题是当我点击“完成”按钮时，拇指仍然无法点击。我想在您点击“完成”
我的第二个问题是 - 如果单击“删除拇指”按钮，这将允许您使用jQueryUI sortable重新排列拇指的顺序。

我在第一个孩子的css集中有一个活跃的类。我希望活动li只在列表中的第一个上。因此，如果您拖动第一个li，它将删除活动类，然后列表中的第一个li将成为活动类。

.gallery li a.active:first-child

我有以下演示代码： http://jsfiddle.net/3E2Hg/73/

希望有人能提供帮助，

由于

Answer 1

FOR FORBLBL 1 - 你可以使用DEMO FIDDLE

的标志

代码 -

var disonclick = false;

$(function deleteImage(){
    $(".deleteAllImages").click(function() {

        $('.deleteAllImages').hide();
        $('.cancelDeleteImages').show();

        //TODO: Need to disable href from being clickable when in delete mode
        disonclick = true;
        $('#sortable li a').click(function(e){
            if(disonclick) e.preventDefault();
        });        
        //TODO: Need to make active class toggle when first in the list (first li = active)

        $( "#sortable" ).sortable("enable");
        $( "#sortable" ).sortable({
            //Need to allow the user to be able to scrollover the thumbnails on device
            //delay: 900, // touch and hold to activate li being sortable
            //scroll: true, // allow user to scroll over thumbnails
            placeholder: "ui-state-highlight"
        });
    });
});

$(function cancelDeleteImages(){
    $(".cancelDeleteImages").click(function() {
        $('.cancelDeleteImages').hide(); 
        $('.deleteAllImages').show(); 
        disonclick = false;
        $( "#sortable" ).sortable("disable");  
    });
});

Answer 2

老兄，关于你的第一个问题，这是解决方案。

$(function cancelDeleteImages(){
    $(".cancelDeleteImages").click(function(event) {

        $('.cancelDeleteImages').hide(); 
        $('.deleteAllImages').show(); 

        $( "#sortable" ).sortable("disable");
        $('#sortable li a').unbind('click').click();
       // return true;
    });
});

第二个问题，我不明白，能不能详细解释

第二个解决方案：

$( "#sortable" ).sortable({
            //Need to allow the user to be able to scrollover the thumbnails on device
            //delay: 900, // touch and hold to activate li being sortable
            //scroll: true, // allow user to scroll over thumbnails
            placeholder: "ui-state-highlight",

            stop: function(event, ui) {

           $('ul#sortable a.active').removeClass('active');
        $('ul#sortable a:first').addClass('active');
            }
        });

用上面的替换你的.sortable。工作

Answer 3

使用jQuery.on()和jQuery.off()功能进行事件处理，同时提供bind() / unbind()个功能

通过

防止默认点击事件

$('#sortable li a').on("click",function() {
        return false;
    });

启用

$('#sortable li a').off("click");

demo : http://jsfiddle.net/VZwV9/

希望这能帮助你解决＃1问题

jQuery启用防止默认并为列表中的first-child切换活动类

3 个答案: