如何判斷一個複選框是否實際被點擊？

Question

我有一個綁定多個輸入。

$("#foo", "#bar", "#fooCheckbox", "#barCheckBox").bind("change", function() { 
    // do something here 
    // do something extra here if $(this) was actually clicked 
}); 

既然有啓動輸入，（jQuery的.change（）的一個方法）的變化的其他方式，有沒有辦法判斷一個複選框實際點擊造成變化的事件嗎？

我試過重點，但是焦點事件在複選框的更改事件之前觸發，所以不起作用。

$("#foo", "#bar", "#fooCheckbox", "#barCheckBox").bind("change", function() { 
    // do something here 
    if($(this).is(":focus")) // do something extra here but focus doesn't happen here for checkboxes. 
}); 

編輯＃1

對不起，我真的不知道如何將這種進一步明確...如果複選框被選中，我不關心或不...我知道是什麼。是（「：checked」）是以及如何使用它。這在這裏沒有幫助。我只想知道是否實際點擊了複選框來觸發更改事件。

編輯＃2

我周圍的工作......我第一次綁定點擊輸入和選擇和存儲元素的ID。然後在我的更改綁定中，我檢查是否更改的元素是最後一次點擊的元素。

$("input, select").click(function() { 
    var myId = $(this).attr("id"); 
    lastClickedStore.lastClicked = myId; 
}); 

然後在更改綁定我只是檢查當前的ID是否等於最後點擊的ID。

$("#foo", "#bar", "#fooCheckbox", "#barCheckBox").bind("change", function() { 
    // do something 
    if(lastClickedStore.lastClicked == $(this).attr("id")) // do something else. 
} 

Answer 1

所以這裏是我如何解決這個問題。我首先綁定點擊輸入並選擇並存儲元素的ID。然後在我的更改綁定中，我檢查是否更改的元素是最後一次點擊的元素。

$("input, select").click(function() { 
    var myId = $(this).attr("id"); 
    lastClickedStore.lastClicked = myId; 
}); 

然後在更改綁定我只是檢查當前的ID是否等於最後點擊的ID。

$("#foo", "#bar", "#fooCheckbox", "#barCheckBox").bind("change", function() { 
    // do something 
    if(lastClickedStore.lastClicked == $(this).attr("id")) // do something else. 
} 

Answer 2

如果（$（本）。是（ '：檢查'））......

如果（$（本）.attr（ '檢查'））...

編輯：另外，如果所有複選框都是針對「家庭」的，請確保只有一個可以通過爲每個項目定義名稱=相同所有項目和ID =不同的項目進行檢查。

Ex: 

<input type='checkbox' name='fruits' id='orange' >orange 
<input type='checkbox' name='fruits' id='melon' >melon 
<input type='checkbox' name='fruits' id='banana' >banana 
<input type='checkbox' name='fruits' id='apple' >apple 
<input type='checkbox' name='fruits' id='...' >.... 

EDIT: if it was clicked: the id? 

console.log($(this.id)); 

Answer 3

你能嘗試做：

 
$("#foo", "#bar", "#fooCheckbox", "#barCheckBox").bind("click", function() { 
    // do something here 
    if($(this).is(":checked")) // do something extra here but focus doesn't happen here for checkboxes. 
}); 

希望它可以幫助

Answer 4

綁定到click，而不是change。當複選框的狀態與鍵盤改變了click事件仍然會被觸發，但event.pageX和event.pageY會在這種情況下0，所以你可以寫：

$("#foo, #bar, #fooCheckbox, #barCheckBox").click(function(event) { 
    // Do something here... 
    if (event.pageX > 0) { 
     // Check box was clicked, do something extra here... 
    } 
}); 

Answer 5

試試這個：

<input type="checkbox" onClick="doSomething()"> 

    or 

$("#foo","#bar","#fooCheckbox","#barCheckBox").click(function(){ 
    doSomething(); 
}); 

Answer 6

FrédéricHamidi的回答很好。但是，如果您想以編程方式提出事件「更改」，那麼他的代碼很不幸不起作用。如果你真的想你所描述的，試試這個版本：

$('#foo, #bar').bind({ 
    click: function() { 
     alert('click ' + this.id); 
     if ($(this).hasClass('changed')) { 
      alert('click+change ' + this.id); 
      $(this).removeClass('changed'); 
     } 
    }, 
    change: function() { 
     alert('change ' + this.id); 
     $(this).addClass('changed'); 
    } 
}); 

Demo。