JavaScript/JSP - Почему не работает EventListener «CheckboxStateChange»?

Я создаю веб-проект с использованием JSP, который создает форму, основанную на значениях, взятых из сервлета. Я пытаюсь добавить eventListener к некоторым флажкам, которые на самом базовом уровне вызывают предупреждение, если флажок установлен или снят.JavaScript/JSP - Почему не работает EventListener «CheckboxStateChange»?

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

Это работает. Я должен был подумать об этом. – 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 - Почему не работает EventListener «CheckboxStateChange»?

ответ

Смежные вопросы