2013-05-07 59 views
3

我想dispaly的複選框值,如果我上的打印按鈕如何顯示在JavaScript

這裏單擊選中的複選框值是我的代碼

<! DOCTYPE html> 
<head> 
<script type="text/javascript"> 

function checkbox() 
{ 
    var bk=document.getElementById("bk").value;; 
    var cer=document.getElementById("cr").value; 
    document.writeln(" " + bk); 
    document.write(" " + cer);  
} 
</script> 
</head> 
<body> 
<form> 
    <input type="checkbox" id="bk" name="vehicle" value="Bike">I have a bike<br></br> 
    <input type="checkbox" id="cr" name="vehicle" value="Car">I have a car<br></br> 
    <input type="submit" value=" Print " size="30" onClick="checkbox()"> 
</form> 
</body> 
</html> 

如果我選擇自行車複選框並點擊打印按鈕,它應該顯示唯一的自行車。

+0

你的文件撰寫和writeln會抹殺你已經有任何HTML。 – 2013-05-07 17:43:54

+2

如果您使用'document.write'進行調試,您可能需要考慮移動以使用['console.log'](https://developer.mozilla.org/en/docs/DOM/console.log) - 它更容易,不會影響您的文檔。 – Lix 2013-05-07 17:48:27

回答

0

此功能將創建與每個檢查項目的表單裏面的值的數組:

function checkbox() 
{ 
    var checked = [].reduce.call(document.forms[0].vehicle, function(current, item) { 
    if (item.checked) { 
     current.push(item.value); 
    } 
    return current; 
    }, []); 
    alert(checked); 
} 

Demo

這裏,document.forms[0].vehicle回報你的表格裏面的名字vehicle兩個複選框;我正在使用document.forms[0],因爲您沒有給出該表格的名稱:)

3

我已編輯您的代碼並根據您的需要進行修改。請通過代碼。

<! DOCTYPE html> 
<head> 
<script type="text/javascript"> 

function checkbox() 
{ 
    var bk=document.getElementById("bk").checked;; 
    var cer=document.getElementById("cr").checked; 
    if(bk) document.writeln(" Bike"); 
    if(cer) document.write(" Car"); 
return false; 
} 
</script> 
</head> 
<body> 
<form> 
    <input type="checkbox" id="bk" name="vehicle" value="Bike">I have a bike<br></br> 
    <input type="checkbox" id="cr" name="vehicle" value="Car">I have a car<br></br> 
    <input type="submit" value=" Print " size="30" onClick="return checkbox();"> 
</form> 
</body> 
</html> 
0

繼承人我們的代碼..這應該解決烏爾問題..

<! DOCTYPE html> 
<head> 
<script type="text/javascript"> 

function checkbox() 
{ 
    var bk=document.getElementById("bk").checked;; 
    var cer=document.getElementById("cr").checked; 
    if(bk) document.writeln(" Bike"); 
    if(cer) document.write(" Car"); 
return false; 
} 
</script> 
</head> 
<body> 
<form> 
    <input type="checkbox" id="bk" name="vehicle" value="Bike">I have a bike<br></br> 
    <input type="checkbox" id="cr" name="vehicle" value="Car">I have a car<br></br> 
    <input type="submit" value=" Print " size="30" onClick="return checkbox();"> 
</form> 
</body> 
</html>