獲取JavaScript dynimcally創建控制狀態

Question

我動態地添加一些行到我的ASP.NET表，我有每行中的幾個細胞和每個單元包含動態創建的控制：

  var TD = document.createElement('td'); 
     var spanCheck = document.createElement("span"); 
     spanCheck.innerHTML = "<input type='checkbox' name='vehicle' value='Car'>mycheck"; 
     spanCheck.id = "newfoodcheck0"; 
     spanCheck.onclick = function() { 

      if (spanCheck.checked) 
       alert('checked'); 
      else 
       alert('unchecked'); 
     }; 

     TD.appendChild(spanCheck); 

我爲這個跨度添加一個onclick函數（這是呈現爲一個複選框），我想知道它是什麼時候被檢查，但if (spanCheck.checked)不起作用，我總是在我的警報中'取消選中'，這裏出了什麼問題？我應該使用spanCheck.checked或我應該使用document.getElementById(spanCheck.id).checked？我已經測試過了，但是再次沒有運氣！我怎麼知道我的複選框是選中還是已知？

Answer 1

在您的代碼中，spanCheck未呈現爲複選框。它包含一個複選框。因此，沒有這樣的財產spanCheck.checked。但是，是 a spanCheck.children[0].checked財產。

Answer 2

你在做什麼是在spanCheck上添加click事件並檢查spanCheck.checked。然而，checked屬性位於spanCheck的子元素的輸入元素上。你可能會想這樣做：

var TD = document.createElement('td'); 
    var spanCheck = document.createElement("span"); 
    spanCheck.innerHTML = "<input id='my_input' type='checkbox' name='vehicle' value='Car'>mycheck"; 
    spanCheck.id = "newfoodcheck0"; 
    spanCheck.onclick = function() { 
      var input = document.getElementById('my_input'); 
      if (input.checked) 
       alert('checked'); 
      else 
       alert('unchecked'); 
     }; 

另外，我認爲你還沒有插入你的TD到身體。因此，在最後一行，你應該使用的appendChild：

TD.appendChild(spanCheck);  
document.body.appendChild(TD); 

另一件事，你不應該在跨度附加onclick事件。您應該在輸入元素上附上相同的內容。下面的代碼是這樣做的：

var TD = document.createElement('td'); 
    var spanCheck = document.createElement("span"); 
    spanCheck.innerHTML = "<input id='my_input' type='checkbox' name='vehicle' value='Car'>mycheck"; 
    spanCheck.id = "newfoodcheck0"; 

    TD.appendChild(spanCheck); 
    document.body.appendChild(TD); 
    var input = document.getElementById('my_input'); 

    input.onclick = function() { 
     if (input.checked) 
      alert('checked'); 
     else 
      alert('unchecked'); 
    };