jQuery可選事件

我有一個jQuery插件，將元素拖放到不同的容器中，我想附加一些事件，例如元素位於容器上時。這些事件過去都很完美，但之後他們停止了工作。由於某些原因，可選特定事件不會被解僱，但是當我將一個點擊進行綁定時，它就可以工作。jQuery可選事件

例子：

//these are not working 
$('#sortable2').bind("sortover", function(event, ui) { 
    alert("here"); 
}); 
$('#sortable2').bind('sortreceive', function() { 
     alert('User clicked on "sortable2."'); 
    }); 
$('.droptrue').bind("sortout", function(event, ui) { 
    $(this).css("background", "transparent"); 
});

相關的代碼是：

var selectedClass = 'ui-state-highlight', 
    clickDelay = 300,  // click time (milliseconds) 
    lastClick, diffClick; // timestamps 

$("ul.droptrue li") 
    // Script to deferentiate a click from a mousedown for drag event 
    .bind('mousedown mouseup', function(e){ 
     if (e.type=="mousedown") { 
      lastClick = e.timeStamp; // get mousedown time 
     } else { 
      diffClick = e.timeStamp - lastClick; 
      if (diffClick < clickDelay) { 
       // add selected class to group draggable objects 
       $(this).toggleClass(selectedClass); 
      } 
     } 
    }) 
    .draggable({ 
     revertDuration: 10, // grouped items animate separately, so leave this number low 
     containment: '.multiSelect', 
     start: function(e, ui) { 
      ui.helper.addClass(selectedClass); 
     }, 
     stop: function(e, ui) { 
      // reset group positions 
      $('.' + selectedClass).css({ top:0, left:0 }); 
     }, 
     drag: function(e, ui) { 
      // set selected group position to main dragged object 
      // this works because the position is relative to the starting position 
      $('.' + selectedClass).css({ 
       top : ui.position.top, 
       left: ui.position.left 
      }); 
     } 
    }); 
$("ul.droptrue") 
    .sortable() 
    .droppable({ 
     drop: function(e, ui) { 
      $('.' + selectedClass) 
      .appendTo($(this)) 
      .add(ui.draggable) // ui.draggable is appended by the script, so add it after 
      .removeClass(selectedClass) 
      .css({ top:0, left:0 }); 
     } 
    }); 

$('#total').text(autoCompleteSourceArray.length); 
$('#filter-count').text(autoCompleteSourceArray.length); 
//Adding Filtering functionality for the lists 
$("#filter").keyup(function() { 
    var filter = $(this).val(), count = 0; 
    $("ul.droptrue:first li").each(function() { 
     if ($(this).text().search(new RegExp(filter, "i")) < 0) { 
      $(this).addClass("hidden"); 
     } else { 
      $(this).removeClass("hidden"); 
      count++; 
     } 
    }); 
    $("#filter-count").text(count); 
}); 

// bind events in order to show or hide the message in the drop zones 
$('ul[id^="sortable"]').live("sortover", function(event, ui) { 
    $(this).css("background", "#f7f6d7"); 
}); 
$('ul[id^="sortable"]').live("sortout", function(event, ui) { 
    $(this).css("background", "transparent"); 
});

非常感謝

來源

2011-12-08 AhmadAssaf

你有沒有得到任何錯誤？或者只是不工作...，如果他們不工作，那麼他們沒有被連接，或者後來的事件解除綁定，可能會導致它無法工作。嘗試和粘貼在你的'控制檯'窗口上的代碼，看看它是否有效，然後， – Val

我沒有得到任何錯誤，即使從控制檯運行一切都很好，但事件沒有綁定，當我調試我發現內部身體是沒有執行由於某種原因 – AhmadAssaf

「內部身體」你的意思是警報？如果是這樣，那麼它是有道理的，因爲他們沒有綁定，所以他們爲什麼:)，你可以使用jsfiddle嗎？以顯示更多的代碼，或者這是如何工作的，因爲它可能需要一段時間...但是，我認爲，你應該真正使用live（）函數，因爲它們是動態的，並且我一直在想。 – Val

-1

如果您最近更新的jQuery 1.7+你應該注意到live()方法已過時。

從jQuery 1.7開始，不推薦使用.live（）方法。使用.on（）連接到事件處理程序。老版本jQuery的用戶應該優先使用 .delegate（），而不是.live（）。

來源

2011-12-08 15:15:18 Stefan

jQuery可選事件

回答

相關問題