首頁  >  文章  >  web前端  >  jquery在ie7下選擇器的問題導致append失效的解決方法_jquery

jquery在ie7下選擇器的問題導致append失效的解決方法_jquery

WBOY
WBOY原創
2016-05-16 15:20:401254瀏覽

1,有如下這樣一段html

複製程式碼 程式碼如下:


 



 



 2,我用jquery動態填入tbody下的內容程式碼如下

複製程式碼 程式碼如下:

$("#pending table tbody").empty().append(th).append(html);

 這段程式碼在ie7及以下ie版本會有問題,jquery無法透過#pending table tbody 找到正確的dom位置並append內容。需要修改,修改的程式碼如下

複製程式碼 程式碼如下:

$("table tbody").empty().append(th).append(html);

 把#pending去掉 直接透過table tbody找dom

3,我一時很疑惑,級聯的選擇器很常見,但是在ie7下為什麼有這種問題,難道是jquery的bug或者div下嵌套table tbody的html寫法不夠標準?

下面繼續補充:

jquery在IE中使用append應注意的問題

$(document).ready(function() {
   $.ajax({
     url: 'Cutepage.htm',
     dataType: 'json',
     data: 'type=Init&PageSize=' + EachPage + '&PageIndex=1',
     success: function(msg) {

      //在IE7下无法显示,在火狐下没有问题。。。。。
      $('#Content').append('<tr><td width="19%"> 商品编号</td><td width="15%">商品名字</td><td width="20%">供应商商编号</td><td width="30%">商品种类编号</td><td width="10%">单价</td></tr>');

     },
    error: function(x) { alert("服务器错误代码:" + x.status); $('#Loading').hide(); }
   });
 });

修改(如下):

$(document).ready(function() {
   $.ajax({
     url: 'Cutepage.htm',
     dataType: 'json',
     data: 'type=Init&PageSize=' + EachPage + '&PageIndex=1',
     success: function(msg) {

      //修改后...(这样就没有问题了,可以看出Jquery对html标签是比较敏感的,以后需要注意........) 
      var pageContent = '';  
       pageContent += '<table border="2">';
       pageContent += '<tr><td width="19%"> 商品编号</td><td width="15%">商品名字</td><td width="20%">供应商商编号</td><td width="30%">商品种类编号</td><td width="10%">单价</td></tr>';
       pageContent += '</table>';      
       $('#Content').append(pageContent );

     },
    error: function(x) { alert("服务器错误代码:" + x.status); $('#Loading').hide(); }
   });
 });

就是將內容複製給一個參數,不要直接使用html內容。

jQuery的append方法不支援連接等HTML屬性的解決

很鬱悶,今天寫程序,想在文檔對像中append一些html上去,諸如

這些完全沒有問題,可是碰到了帶鏈接的HTML如:

複製程式碼 程式碼如下:

$("#test").append("test");

firefox毫無問題,IE6、IE7一直到IE8就死活上不去,只顯示文字內容,不帶任何連線。準備Google一下,卻發現Google.com已然無法登陸,Google.cn上查詢出來的基本上一頁全是採集站的那些垃圾文章,很是鬱悶。搞了半天,找到一篇文章,說是jQuery自身append函數的問題,這個函數自己帶類似HTML解析和分析的語句,基本的html沒問題,碰到連結或未完全關閉的標籤或是自訂的標籤,jQuery就死活認不出來。不知道是否真的如此,手邊的js庫是壓縮版,太晚了頭也昏昏沉沉不想再去看勞什子原始碼了。直接自己Create一個a標籤的元素插入進去好了,這樣搞:

複製程式碼 程式碼如下:

$(document.createElement(‘a')).attr({"href":"#", "id": ‘#mylink'}).appendTo("#test");

然後給這個連結附上內容:

複製程式碼 程式碼如下:

$(‘#mylink').text("test");

哎,累不累。不管了,睡覺了,明天有空看看jQuery的原始碼是怎麼寫的吧。
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn