結合兩個腳本元素

Question

我有一個腳本，其中有一些複選框顯示一個圖像來代替正常的複選框。根據複選框的狀態顯示不同的圖像，效果很好。

我也有一個提交按鈕，我想禁用，如果任何複選框被選中。我有一些代碼，這將做到這一點，但是當我包含此代碼以及代碼來更改圖像它不起作用。有沒有辦法可以將兩種代碼結合在一起，這樣它們都可以工作。

代碼以改變複選框圖像

$('.checkbox').each(function(){ 
$(this).hide().after('<div class="class_checkbox" />'); 

}); 

$('.class_checkbox').on('click',function(){ 
$(this).toggleClass('checked').prev().prop('checked',$(this).is('.checked')) 
}); 

代碼以禁用提交按鈕

$(function() { 
$(".checkbox").click(function(){ 
    $('.delete').prop('disabled',$('input.checkbox:checked').length >0); 

}); 

}）;

任何幫助將是偉大的。

謝謝德雷克

Answer 1

第一個腳本隱藏複選框，使其不被點擊。當div被顯示而不是它們被點擊時，對應的複選框狀態以編程方式更新。由於真正的複選框沒有收到「點擊」事件，因此第二個片段中的點擊處理程序將永遠不會執行。

解決這個問題的最簡單的方法是在格點擊執行

$('.delete').prop('disabled', $('input.checkbox:checked').length > 0); 

。你可以通過它移動到該處理程序：

$('.class_checkbox').on('click', function() { 
    //... 
}); 

Answer 2

如果你簡單地設置禁用提交按鈕.class_checkbox的點擊收聽，一切工作正常。

$(".class_checkbox").click(function(){ 
    $('.delete').prop('disabled',$('input.checkbox:checked').length >0); 

}); 

http://jsfiddle.net/s2BAp/