的Javascript複選框的onchange

Question

我有一個複選框的形式，我想它按照以下方案工作：

如果有人檢查它，一個文本框（totalCost）的值應設置爲10。然後，如果我退回並取消選中，則函數calculate()將根據表單中的其他參數設置值totalCost。

所以基本上，我需要的部分是，當我檢查複選框時，我做了一件事，當我取消選中它時，我做了另一件事。

Answer 1

function calc() 
{ 
    if (document.getElementById('xxx').checked) 
    { 
     document.getElementById('totalCost').value = 10; 
    } else { 
     calculate(); 
    } 
} 

HTML

<input type="checkbox" id="xxx" name="xxx" onclick="calc();"/> 

Answer 2

使用onclick事件，因爲每當點擊一個複選框實際上改變它。

Answer 3

如果你正在使用jQuery的..然後我可以建議如下： 注：我在這裏做一些假設

$('#my_checkbox').click(function(){ 
    if($(this).is(':checked')){ 
     $('input[name="totalCost"]').val(10); 
    } else { 
     calculate(); 
    } 
}); 

Answer 4

以下解決方案利用了jQuery的。假設您有一個複選框，其ID爲checkboxId。

var checkbox = $("#checkboxId"); 

checkbox.change(function(event) { 
    var checkbox = event.target; 
    if (checkbox.checked) { 
     //Checkbox has been checked 
    } else { 
     //Checkbox has been unchecked 
    } 
}); 

Answer 5

參考用的複選框的ID和不與＃ 分配功能的onclick屬性，而不是使用改變屬性

var checkbox = $("save_" + fieldName); 
checkbox.onclick = function(event) { 
    var checkbox = event.target; 

    if (checkbox.checked) { 
     //Checkbox has been checked 
    } else { 
     //Checkbox has been unchecked 
    } 
}; 

Answer 6

的Javascript

// on toggle method 
    // to check status of checkbox 
    function onToggle() { 
    // check if checkbox is checked 
    if (document.querySelector('#my-checkbox').checked) { 
     // if checked 
     console.log('checked'); 
    } else { 
     // if unchecked 
     console.log('unchecked'); 
    } 
    } 

HTML

<input id="my-checkbox" type="checkbox" onclick="onToggle()">