如何在html中使用javascript顯示覆選框結果到文本字段和空白區域？

Question

我想要顯示上面顯示的空文本框中已經單擊的內容以及空字段。使用警報消息，下面我已經成功地顯示它們：

function Chosen() { 
     var message = "" 
     if (document.getElementById('cbconditioning').checked == true) { 
      message += " (AC)"} 
    alert("You have selected: " + message +  document.getElementById("cbotherstext").value); 

在那Im請求的代碼我想完全相同的結果在這兩個空字段顯示出來。

的字段和它們的類型有：

<input id="cbconditioning" type="checkbox"/>a. Air Conditioning</td> 


<td class="auto-style63" rowspan="3" type="text" id="emptyspace1a" onclick="Chosen()" > 
      </td> 

<input id="emptytext1" type="text"/></td> 

<input id="cbotherstext" type="text" disabled="disabled" /></td> 

<input type="button" id="chosenlaunch" onclick="Chosen()" value="Equipments Purchased"/> 

我要確保字段包含上述功能。

Answer 1

爲了簡單起見，你應該使用每個複選框的標籤標籤...

<input id="cbconditioning" type="checkbox"/><label for="cbconditioning">a. Air Conditioning</label></td> 

在您選擇的功能，那麼您需要....

var getTextContent = function(node) { 
     var content = ""; 
     try { 
      if (node.nodeType == 1) { 
       var child = node.firstChild; 
       while("undefined" != typeof child && child != null) { 
        content += getTextContent(child); 
        if ("undefined" != typeof child.nextSibling) { 
         child = child.nextSibling; 
        } else { 
         child = null; 
        } 
       } 
      } else if (node.nodeType == 3) { 
       content = node.data; 
      } else if (node.nodeType != 8) { 
       content = node.nodeValue; 
      } 
     } catch(e) { 
      content = ""; 
     } 
     return ""+content; 
    }; 

var selectedItems = []; 
var labels = document.getElementsByTagName('label'); 
for(var idx=0;idx<labels.length;idx++) { 
    if (labels[idx].hasAttribute('for')) { 
     var checkboxNode = document.getElementById(labels[idx].getAttribute('for')); 
     if (checkboxNode.checked) { 
      selectedItems[selectedItems.length] = getTextContent(labels[idx]); 
     } 
    } 
} 
alert('You have selected:'+(selectedItems.join(','))); 

把你的數據成另一個元素也很容易...

var targetNode = document.getElementById('TargetNode'); 
while(targetNode.firstChild) { targetNode.removeChild(targetNode.firstChild); } 
targetNode.appendChild(document.createTextNode(selectedItems.join(',')));