JavaScript/JSP - 爲什麼「CheckboxStateChange」eventListener不工作？

我使用JSP創建了一個Web項目，該JSP基於從servlet中獲取的值創建表單。我試圖將一個eventListener添加到一些複選框，在最基本的情況下，在選中或取消選中時會彈出一個警告框。JavaScript/JSP - 爲什麼「CheckboxStateChange」eventListener不工作？

JSP：

<c:if test="${type == 'impactedSite'}"> 
          <div id="${type}"> 
           <div id="products"> 
            <h4>Product:</h4> 
            <input class="checkBoxes" type="checkbox" name="product" value="Anaesthetic"> Anaesthetic<br /> 
            <input class="checkBoxes" type="checkbox" name="product" value="Analgesic"> Analgesic<br /> 
            <input class="checkBoxes" type="checkbox" name="product" value="Antacid"> Antacid<br /> 
           </div> 
           <div id="processes"> 
            <h4>Process:</h4> 
           </div> 
           <div id="equipment"> 
            <h4>Equipment:</h4> 
           </div> 
          </div><br /><br /> 
         </c:if>

的JavaScript：

if(document.getElementById("impactedSite")){ 

     var anaesthetic = ["a", "b", "c"]; 
     var analgesic = ["d", "e"]; 
     var antacid = ["f", "g"]; 

     var processesElement = document.getElementById("processes"); 

     var checkBoxes = document.getElementsByClassName("checkBoxes"); 

     for(var i = 0; i < checkBoxes.length; i++){ 

      alert("Checkbox" + i); 

      checkBoxes[i].addEventListener("CheckboxStateChange", function(event){ 

       var checkbox = event.target; 
       if (checkbox.checked) { 
        alert ("The check box is checked."); 
       } 
       else { 
        alert ("The check box is not checked."); 
       } 

      }, false); 

     } 

    }

我<script>標籤聲明最後在<body>。循環中的警報（alert("Checkbox" + i);）工作正常，只是檢查並取消選中框不會引發警報。

來源

2015-05-07 NeedsHelp

儘量只change事件：

checkBoxes[i].addEventListener("change", function(event){

來源

2015-05-07 09:52:24 Arvind

This works。我應該想到這一點。 – NeedsHelp

我立即看到的一件事是eventlistener的回調中缺少事件對象引用。有一個看看下面修改的摘錄：

checkBoxes[i].addEventListener("CheckboxStateChange", function(event){ 

      var checkbox = event.target; 
      if (checkbox.checked) { 
       alert ("The check box is checked."); 
      } 
      else { 
       alert ("The check box is not checked."); 
      } 

     }, false);

來源

2015-05-07 09:45:53

我給你建議的變化，它仍然沒有工作。 – NeedsHelp

CheckboxStateChange僅適用於Firefox。我假設你正在使用不同的瀏覽器。有關詳情，請訪問http://help.dottoro.com/ljihlcqe.php –

JavaScript/JSP - 爲什麼「CheckboxStateChange」eventListener不工作？

回答

相關問題