jQuery chắp thêm không hoạt động trong 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); 
     }); 

Mã của tôi không hoạt động trong Internet Explorer và tôi không biết tại sao. Tất cả các trình duyệt khác đều ổn nhưng IE thì không. Anh ấy không thêm ngay cả 1 hộp văn bản.

Answer 1

ya vấn đề là IE chế độ tương thích. Điều này hoạt động tốt trong IE9 http://jsfiddle.net/NP9pG/3/ và firefox nhưng khi bạn chuyển sang chế độ tương thích IE, nó không hoạt động.

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

nhưng http://jsfiddle.net/NP9pG/4/ này sẽ làm việc tho tốt trong chế độ tương thích IE

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

ya vấn đề là html của bạn mark-up như đề xuất thực hiện thay đổi sau

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

thay vì thêm mục đến table thay vì div phần tử

đang do đó 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>'); 

hy vọng rằng sẽ giúp

Answer 2

Câu hỏi là:

• Bạn có $ truy cập được xác định?
• Bạn đã xác định $ countonlyadd chưa?
• Bạn có < table> trình bao bọc trong #buttondiv không?

Hãy suy nghĩ về những câu hỏi này và nếu kết quả là "không", đó là vấn đề

Nếu bạn có < table> wrapper, thay đổi

$('#buttondiv'). 

để

$('#buttondiv table'). 

Answer 3

Nó xuất hiện bạn đang thêm một TR vào một div, đây có thể là vấn đề của bạn. Bạn nên thêm nó vào TBODY của một BẢNG thay thế.

Answer 4

Có lẽ nó sẽ giúp ích nếu bạn tạo các yếu tố đầu tiên .. đồng thời tạo đối tượng cho hàng, cột, hộp văn bản, v.v. Và nối thêm vào nhau. Cuối cùng nối thêm hàng vào div của bạn. Bên cạnh đó, có một chút lạ khi thêm hàng vào div, chứ không thêm vào một bảng ...

Answer 5

Có vẻ như bạn đang thêm một số tr vào đó không phải là một html hợp lệ trong bất kỳ trình duyệt nào. Các trình duyệt khác sẽ không kêu lên nhưng IE sẽ làm như vậy. Thử cái này.

Làm việc demo

Markup thay đổi thay đổi

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