Приложение jQuery не работает в 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);
        });

Мой код не работает в Internet Explorer, и я не знаю почему.Все остальные браузеры в порядке, но IE нет.Он не добавляет даже 1 текстовое поле.

Answer 1

Да, проблема в режиме совместимости IE.Это прекрасно работает в IE9 http://jsfiddle.net/NP9pG/3/ и Firefox, но когда вы переключаетесь в режим совместимости с IE, это не работает.

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

, но это http://jsfiddle.net/NP9pG/4/ будет хорошо работать в IEрежим совместимости

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

да, проблема в том, что ваша HTML-разметка, как предлагается, внесите следующее изменение

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

вместо добавления элементов в table вместо div element

поэтому 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>');

надеюсь, что это поможет

Answer 2

Похоже, вы добавляете tr непосредственно в который не является допустимым HTML ни в одном браузере.Другие браузеры не будут кричать, но IE будет.Попробуйте это.

Рабочая демо

Изменение разметки

<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);
        });

Answer 3

Похоже, вы добавляете один TR в div, что может быть вашей проблемой.Вместо этого вы должны добавить его в TBODY ТАБЛИЦЫ.

Answer 4

Может быть, это поможет, если вы сначала создадите элементы ... так что создайте объект для вашей строки, столбца, текстового поля и т. Д. И затем добавьте это друг в друга. Наконец добавьте строку к вашему div. Кроме того, немного странно добавлять строку в div, а не в таблицу ...

Answer 5

Вопросы:

• У вас есть счетчик $?
• У вас есть $ countonlyadd?
• У вас есть <<code>table> оболочка в #buttondiv?

Подумайте над этими вопросами, и если результат «нет», это проблема

Если у вас <<code>table> оболочка, измените

$('#buttondiv').

до

$('#buttondiv table').