檢查一個複選框的狀態是否改變了Javascript

我已經使用JavaScript動態地創建了一些複選框（如下），當點擊一個複選框（狀態已更改）時如何調用函數的任何想法？檢查一個複選框的狀態是否改變了Javascript

var eng_types = table[3].slice(3); 
for(var i in eng_types) { 
    var name = eng_types[i]; 

    // Create the necessary elements 
    var label = document.createElement("label"); 
    var checkbox = document.createElement("input"); 
    var description = document.createTextNode(name); 

    checkbox.type = "checkbox";  // Make the element a checkbox 
    checkbox.value = name;   // Make its value "pair" 
    checkbox.name = i;    // Give it a name we can check 

    label.appendChild(checkbox); // Add the box to the element 
    label.appendChild(description); // Add the description to the element 

    // Add the label element to your div 
    document.getElementById('eng_options').appendChild(label); 
}

任何關於如何使每個複選框出現在一個新行的想法也將不勝感激。

在此先感謝！

來源

2015-04-17 Hayley van Waas

可能重複的[jQuery複選框選中狀態更改事件]（http://stackoverflow.com/questions/8423217/jquery-checkbox-checked-state-changed-event） – IronFlare

使用jQuery checkbox checked state changed event：

$("#i").change(function() { 
    if(this.checked) { 
     //Do stuff 
    } 
});

既然你動態添加的元素，一個更強大的解決方案可能是使用這個（感謝@IgorAntun用於提bind和on）：

$(document).on("change", "#i", function() { 
    if(this.checked) { 
     //Do stuff 
    } 
});

給評論添加上下文：上面的例子以前使用過選擇器$("[name='i']")，因爲我正在治療checkbox.name = i像一個字符串，而不是它的變量。

至於使每個複選框出現在一個新行，你可以<p></p>標籤，標籤<br />，<div></div> tags--真的族元素或具有間距的任何標記。另外，你可以使用CSS。這種方法是我最喜歡的，因爲它允許調整複選框的間距，這是HTML標籤無法做到的。

input { 
    display: block; 
    margin-top: 2px; 
}

來源

2015-04-17 22:59:52 IronFlare

似乎無法使'[name = '我']'工作，只有當我指定複選框的ID時纔有效。想法？ –

糟糕，我完全忽略了那是一個變量的事實。我建議使用一個常量id來引用它們中的每一個。（爲什麼不''我'？:)） – IronFlare

你也可以也可以使用.bind('change', [...])或.on('change', [...])，作爲替代@ IronFlare的答案。 例子：

使用.bind('change')：

$('#item-to-check').bind('change', function() { 
    if(this.checked) { 
     // Element is checked 
    } else { 
     // Element is not checked 
    } 
});

使用.on('change')：

$('#item-to-check').on('change', function() { 
    if(this.checked) { 
     // Element is checked 
    } else { 
     // Element is not checked 
    } 
});

另外，我建議在What is best way to perform jQuery .change()檢查出馬特的答案。

來源

2015-04-17 23:06:19

檢查一個複選框的狀態是否改變了Javascript

回答

相關問題