的Javascript複選框的onchange

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

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

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

2011-06-15 bikey77

Checkboxid.Checked == true/false {編寫您的活動}。 – Naresh 2011-06-15 13:52:20

101

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

HTML

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

來源

2011-06-15 13:49:46

+13

如果用戶使用鍵盤？ – thomthom 2013-12-18 11:36:16

+15

你試過了嗎？ – 2013-12-18 14:03:42

你可以寫jsFiddle，以便我可以試試這個嗎？點擊時我也必須有一個複選框做東西。 – 2015-01-31 09:58:06

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

來源

2011-06-15 13:47:43 SergeS

+20

如果用戶使用鍵盤怎麼辦？ – thomthom 2013-12-18 11:35:58

+10

它很平坦，但它仍然是點擊 – SergeS 2013-12-19 13:55:04

確實點擊了作品，當您使用標籤切換複選框時，它甚至會被解僱。但你應該更好地使用'改變'事件！ 'change'事件是爲此目的而設計的：https：//developer.mozilla.org/en-US/docs/Web/Events/change – ReeCube 2015-06-01 12:42:45

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

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

來源

2011-06-15 14:00:16

以下解決方案利用了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 
    } 
});

來源

2015-05-11 13:54:28 Eugene

參考用的複選框的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 
    } 
};

來源

2015-05-21 12:31:24 Bart

的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()">

來源

2017-06-16 13:10:44 0x1ad2

的Javascript複選框的onchange

回答

相關問題