jQuery Agregar no funciona en IE8

Question

$('#buttonadd').click(function(){ 
      if ($counter < 10) 
      { 
       $counter++; 
       $countonlyadd++; 
       $('#buttondiv').append('<tr><td><select class="combo" name="combo'+$counter+'" style="width: 60px;" size="1"><option>UND</option><option>OHNE</option><option>ODER</option></select></td><td><input type="text" name="textbox'+$counter+'" class="textbox" value="" /><a id="removetxt" class="removetxt" style="text-decoration: none;line-height: 3;" href="#">&nbsp;[X]</a></td></tr>'); 
      }else{ 
      } 
      $('#send_count').val($countonlyadd); 
     }); 

Mi código no funciona en Internet Explorer, y no sé por qué. Todos los demás navegadores están bien, pero IE no. Él no está agregando ni 1 cuadro de texto.

Answer 1

ya el problema es el modo de compatibilidad de IE. Esto funciona bien en IE9 http://jsfiddle.net/NP9pG/3/ y firefox, pero cuando cambias al modo de compatibilidad IE no funciona.

<div id="buttondiv"> </div> 
<div id="send_count"></div> 
<input type="button" id="buttonadd" value="add" /> 

pero esto http://jsfiddle.net/NP9pG/4/ funcionará bien aunque en modo de compatibilidad de IE

<table id="buttondiv"> </table> 
<div id="send_count"></div> 
<input type="button" id="buttonadd" value="add" /> 

ya el problema es su marcado HTML como se sugiere hacer el siguiente cambio

<div id="buttondiv"> 
    <table id="tableData"></table> 
</div> 

lugar necesario añadir elementos a table en lugar de div elemento

código, por tanto, JS:

$('#tableData').append('<tr><td><select class="combo" name="combo'+$counter+'" style="width: 60px;" size="1"><option>UND</option><option>OHNE</option><option>ODER</option></select></td><td><input type="text" name="textbox'+$counter+'" class="textbox" value="" /><a id="removetxt" class="removetxt" style="text-decoration: none;line-height: 3;" href="#">&nbsp;[X]</a></td></tr>'); 

esperanza de que ayuda a

Answer 2

Las preguntas son:

• ¿Se han definido $ mostrador?
• ¿Tiene $ countonlyadd definido?
• ¿Tiene < table> envoltura en #buttondiv?

pensar en estas preguntas y si el resultado es "no", que es el problema

Si tiene < table> envoltorio, cambie

$('#buttondiv'). 

a

$('#buttondiv table'). 

Answer 3

Se Parece que estás agregando un solo TR a un div, que puede ser tu problema. Debe agregarlo al TBODY de una TABLA en su lugar.

Answer 4

Tal vez te ayude crear los elementos primero ... así que crea un objeto para tu fila, columna, cuadro de texto, etc. Y luego añádelos uno al otro. Finalmente agrega la fila a tu div. Además de eso, es un poco extraño agregar una fila a un div, y no a una tabla ...

Answer 5

Parece que está agregando un tr directamente en el que no es un html válido en ningún navegador. Otros navegadores no gritarán pero IE lo hará. Prueba esto.

Trabajando demo

cambio marcado cambio

<div id="buttondiv"> 
    <table></table> 
</div> 

JS

$('#buttonadd').click(function(){ 
      if ($counter < 10) 
      { 
       $counter++; 
       $countonlyadd++; 
       $('#buttondiv table').append('<tr><td><select class="combo" name="combo'+$counter+'" style="width: 60px;" size="1"><option>UND</option><option>OHNE</option><option>ODER</option></select></td><td><input type="text" name="textbox'+$counter+'" class="textbox" value="" /><a id="removetxt" class="removetxt" style="text-decoration: none;line-height: 3;" href="#">&nbsp;[X]</a></td></tr>'); 
      }else{ 
      } 
      $('#send_count').val($countonlyadd); 
     });