2014-01-30 1 views
1

Я создаю динамический флажок, устанавливая innerHTML внутри div. Этот флажок имеет событие onclick. Код работает отлично во всех браузерах, кроме IE8.OnClick event on checkbox не работает в IE после замены innerHTML в Javascript

Похоже, что IE не является обязательным событием после установки innerHTML. Есть ли способ переустановить событие?

Ниже приведен внутренний кодHTML.

<INPUT id=Animal onclick=\"updateHTML();\" name=Control value=Animal type=checkbox uncheckedValue=\"0\" checkedValue=\"1\"> 
<INPUT id=Food onclick=\"updateHTML();\" name=Control value=Food type=checkbox uncheckedValue=\"0\" checkedValue=\"1\"> 

Ниже полный код

<HTML> 
<HEAD> 
    <SCRIPT> 
     function updateHTML() 
     { 
      alert('updateHTML'); 
     } 
     function changeEvent() 
     { 
      var innerhtml="\r\n<TBODY id=originalDiv><TR>\r\n<TD title=\"\">\r\n<INPUT id=Animal onclick=\"updateHTML();\" name=Control value=Animal type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Animal\r\n<INPUT id=Food onclick=\"updateHTML();\" name=Control value=Food type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Food\r\n</TD></TR></TBODY>"; 
      var originalDiv=document.getElementById('originalDiv'); 
      var temp = originalDiv.ownerDocument.createElement('div'); 
      temp.innerHTML = '<table>' + innerhtml + '</table>'; 
      originalDiv.replaceChild(temp.firstChild, originalDiv.firstChild); 
     } 
    </SCRIPT> 
</HEAD> 
<BODY> 
    <TABLE> 
     <TBODY id ="originalDiv"> 
      <TR> 
       <TD vAlign=middle> 
        <INPUT id=Bird onclick=\"updateHTML();\" name=Control value=Bird type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Bird 
       </TD> 
      </TR> 
     </TBODY> 
     <TBODY id="submit"> 
      <TR> 
       <TD> 
        <input type=button value="Submit" onclick="changeEvent()"> 
       </TD> 
      </TR> 
     </TBODY> 
    </TABLE> 
<BODY> 

+0

Что делает updateHTML? Можете ли вы показать код? – Huangism

+0

updateHTML имеет только предупреждение. –

+0

ok, тогда вы можете показать код создания флажка? – Huangism

ответ

0

Во-первых, вы должны это исправить:

  • Добавить доктайп. Это важно для IE
  • Добавить HTML закрывающий тег в конце документа
  • Закрыть все ваши входные теги, как это:

<input type="checkbox" id="Bird" value="1" />

  • Если вы используете не атрибуты HTML, использовать "dATA-" префикс:

<input type="checkbox" id="Bird" value="1" data-unckecked-value="0" data-checked-value="1" />

+0

Возможно, это комментарий, так как он напрямую не связан с проблемой. – Boaz

+0

немного дольше для комментария ... И проблема может возникнуть из незакрытых входных тегов. – gtournie

+0

Прежде всего этот код не написан кем-то. Он генерируется некоторой третьей библиотекой Java. Я могу сказать, что код генерируется классами JAVA. На самом деле этот код вводится в JSP через javascript. –

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