將自己的自我傳遞給OnClick事件JavaScript

我在JavaScript中添加到輸入內的點擊事件無法以正確的方式工作。
到目前爲止我的代碼看起來像這樣：將自己的自我傳遞給OnClick事件JavaScript

function order(option) { 
    if(option.checked) { 
     document.getElementId("col_order").value = document.getElementById("col_order").value + " " + option.value; 
    } 
} 
...//somewhere further down 
for(var i = 0; i < options.length; i++) { 
    var check = document.createElement("input"); 
    var label = document.createElement("label"); 
    var description = document.createTextNode(options[i]); 
    check.type = "checkbox"; 
    check.name = "order_list[]"; 
    check.value = options[i]; 
    check.onclick = "order(check)"; //Problem here 
    label.appendChild(check); 
    label.appendChild(description); 
    element.appendChild(label); 
}

我也曾嘗試：

check.onclick = (function() { var option = check; return function() {order(option);}})();

，我遇到的問題是代碼的check.onlick線。當我添加這與普通的HTML：

<input type = "checkbox" name = "order_list[]" onclick = "order(this)" value = "randVal">randVal</input>

我沒有任何問題，該方法以預期的結果執行。有什麼想法嗎？
讓我澄清一下：我是做它的順序功能就好了，但我永遠也進不了if語句，即使該複選框只是點擊

來源

2014-07-10 timtour97

這有什麼問題呢？ – danrodi

「onclick」屬性的值應該是一個函數，而不是一個字符串。 – Pointy

@danrodi現在檢查帖子的底部，我添加了它，對不起！ – timtour97

使用addEventListener相反，即使它看起來像它應該工作，你是覆蓋在每次迭代相同的變量，因爲在for循環沒有關閉，所以我會可能會添加一個閉包來避免問題。

對於你會不會聽的change事件複選框，不click

for(var j = 0; j < options.length; j++) { 
    (function(i) { 

     var check = document.createElement("input"); 
     var label = document.createElement("label"); 
     var description = document.createTextNode(options[i]); 

     check.type = "checkbox"; 
     check.name = "order_list[]"; 
     check.value = options[i]; 

     check.addEventListener('change', function() { 
      if (this.checked) { 
       var col_order = document.getElementById("col_order"); 
       col_order.value = col_order.value + " " + this.value; 
      } 
     }, false); 

     label.appendChild(check); 
     label.appendChild(description); 
     element.appendChild(label); 

    })(j); 
}

FIDDLE

來源

2014-07-10 14:44:22 adeneo

添加事件偵聽器並沒有幫助，我已經可以使用我擁有的代碼來實現該功能。我甚至沒有進入函數中的if語句，但這正是我困惑的地方。 – timtour97

@ timtour97 - 編輯答案，嘗試聽更改事件，並在事件處理程序中使用'this' – adeneo

@ timtour97 - 還有一個錯字，你寫了'getElementId'，這是錯誤的 – adeneo

check.onclick = "order(check)";指定字符串作爲上單擊處理程序。這是行不通的;瀏覽器需要一個function有：

check.onclick = function() { 
    order(check); 
}

來源

2014-07-10 14:43:56

我把它做到很好，但我從來沒有在if語句中做過。 – timtour97

使用'console.log（check）'確保你確實有一個複選框，然後使用'console.log（check.checked）'來查看這是否是一個有效的屬性以及它的值是什麼。 –

您上面發佈的代碼看起來是正確的（請參閱http://stackoverflow.com/questions/4471401/getting-value-of-html-checkbox-from-onclick-onchange-events）;我猜這個bug是在其他地方。 –

將自己的自我傳遞給OnClick事件JavaScript

回答

相關問題