複選框更新

我想更新一些文本來說是否選中複選框。唯一的問題是，當它被選中時，文本框消失，文本將替換它。複選框更新

<form name="form" id="form"> 
    <input type="checkbox" name="cb" id="cb" onClick="check();" /> 
</form> 

<script type="text/javascript"> 
    function check() { 
     document.write("checked: " + document.form.cb.checked); 
    } 
</script>

來源

2012-04-18 droidus

這是因爲你用'文件撰寫（）'在頁面完成後。您需要使用一些DOM操作。 – Teemu 2012-04-18 19:30:33

這是如何工作的？ – droidus 2012-04-18 19:32:18

你所看到的是使用document.write的副作用。它正在用您正在編寫的文本替換整個文檔。嘗試做這樣的事情，而不是。

<form name="form" id="form"> 
    <input type="checkbox" name="cb" id="cb" onClick="check();" /> 
</form> 

<div id="cb-status">checked: false</div> 

<script type="text/javascript"> 
    function check() { 
     document.getElementById('cb-status').innerHTML = "checked: " + document.form.cb.checked; 
    } 
</script>

來源

2012-04-18 19:33:18 Garett

我認爲這是一種可能性，但認爲必須有另一種方式。 – droidus 2012-04-18 19:34:31

我只會加

checked: false

– droidus 2012-04-18 19:35:47

如果你更新你的問題，顯示你想要顯示的信息的HTML，那麼我可以相應地更新我的答案。 – Garett 2012-04-18 19:42:27

您可以使用jQuery使事情更容易爲你：

考慮你有一個複選框：

<input type="checkbox" >

並與一個id =消息span元素：

<span id="message"></span>

然後，當你點擊一個複選框時，如果選中或不選中，它將在範圍中「寫入」。

$("document").ready(function(){ 
    $(":checkbox").click(function(){ 
     $("span#message").html("Checkbox is checked: " + $(this).is(":checked")); 
    }); 
});

見它的jsfiddle：HTML右括號後http://jsfiddle.net/WNDUH/3/

來源

2012-04-18 19:35:18 aldux

我嘗試運行這個時發生錯誤 – droidus 2012-04-18 19:36:07

支架缺失是（「：勾選」）和字符串連接：

$(":checkbox").click(function(){ 
    $("span#message").html("Checkbox is checked: " + $(this).is(":checked")); 
});

來源

2012-04-18 19:48:02

您是對的。謝謝。 – aldux 2012-04-18 19:54:18

回答

相關問題