jquery在ie7下選擇器的問題導(dǎo)致append失效的解決方法
1,有如下這樣一段html
<div class="right"id="pending">
<table class="one"width="100%"border="0"cellspacing="0"cellpadding="0">
<tbody>
</tbody>
</table>
<div id="pendingpage"class="paging">
</div>
</div>
2,我用jquery動態(tài)填充tbody下的內(nèi)容代碼如下
$("#pending table tbody").empty().append(th).append(html);
這段代碼在ie7及以下ie版本會有問題,jquery無法通過#pending table tbody 找到正確的dom位置并append內(nèi)容。需要修改,修改的代碼如下
$("table tbody").empty().append(th).append(html);
把#pending去掉 直接通過table tbody找dom
3,我一時很疑惑,級聯(lián)的選擇器很常見,但是在ie7下為什么有這種問題,難道是jquery的bug或者div下嵌套table tbody的html寫法不夠標準?
下面繼續(xù)補充一下:
jquery在IE中使用append應(yīng)注意的問題
$(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%">供應(yīng)商商編號</td><td width="30%">商品種類編號</td><td width="10%">單價</td></tr>'); }, error: function(x) { alert("服務(wù)器錯誤代碼:" + 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%">供應(yīng)商商編號</td><td width="30%">商品種類編號</td><td width="10%">單價</td></tr>'; pageContent += '</table>'; $('#Content').append(pageContent ); }, error: function(x) { alert("服務(wù)器錯誤代碼:" + x.status); $('#Loading').hide(); } }); });
就是將內(nèi)容復(fù)制給一個參數(shù),不要直接使用html內(nèi)容。
jQuery的append方法不支持連接等HTML屬性的解決
很是郁悶,今天寫程序,想在文檔對象中append一些html上去,諸如<b><p>這些完全沒有問題,可是碰到了帶鏈接的HTML如:
$("#test").append("<a href='#'>test</a>");
firefox毫無問題,IE6、IE7一直到IE8就死活上不去,只顯示文本內(nèi)容,不帶任何連接。準備Google一下,卻發(fā)現(xiàn)Google.com已然無法登陸,Google.cn上查詢出來的基本上一頁全是采集站的那些垃圾文章,很是郁悶。搞了半天,找到一篇文章,說是jQuery自身append函數(shù)的問題,這個函數(shù)自己帶類似HTML解析和分析的語句,基本的html沒問題,碰到鏈接或者未完全關(guān)閉的標簽或者是自定義的標簽,jQuery就死活認不出來。不知道是否真的如此,手頭的js庫是壓縮版,太晚了頭也昏昏沉沉不想再去看勞什子源代碼了。直接自己Create一個a標簽的元素插入進去好了,這樣搞:
$(document.createElement(‘a(chǎn)')).attr({"href":"#", "id": ‘#mylink'}).appendTo("#test");
然后給這個鏈接附上內(nèi)容:
$(‘#mylink').text("test");
哎,累不累啊。不管了,睡覺了,明天有空看看jQuery的源代碼是怎么寫的吧。
- jQuery添加新內(nèi)容的四個常用方法分析【append,prepend,after,before】
- 解決jQuery使用append添加的元素事件無效的問題
- jquery append與appendTo方法比較
- jquery?追加元素append、prepend、before、after用法與區(qū)別分析
- jquery append 動態(tài)添加的元素事件on 不起作用的解決方案
- jQuery使用append在html元素后同時添加多項內(nèi)容的方法
- 解決Jquery向頁面append新元素之后事件的綁定問題
- jQuery中appendTo()方法用法實例
- jQuery中append()方法用法實例
- JS實現(xiàn)jQuery的append功能
相關(guān)文章
jQuery實現(xiàn)帶延時功能的水平多級菜單效果【附demo源碼下載】
這篇文章主要介紹了jQuery實現(xiàn)帶延時功能的水平多級菜單效果,可實現(xiàn)響應(yīng)鼠標事件延時展示菜單的功能,涉及jQuery結(jié)合時間函數(shù)動態(tài)操作頁面元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-09-09jQuery html表格排序插件tablesorter使用方法詳解
這篇文章主要為大家詳細介紹了jQuery html表格排序插件tablesorter的使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02CSS3 media queries結(jié)合jQuery實現(xiàn)響應(yīng)式導(dǎo)航
這篇文章主要為大家詳細介紹了CSS3 media queries結(jié)合jQuery實現(xiàn)響應(yīng)式導(dǎo)航,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-09-09jQuery UI工具提示框部件Tooltip Widget
這篇文章介紹了jQuery UI工具提示框部件Tooltip Widget,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06jquery easyui 結(jié)合jsp簡單展現(xiàn)table數(shù)據(jù)示例
這篇文章主要介紹了jquery easyui 結(jié)合jsp簡單展現(xiàn)table數(shù)據(jù),需要的朋友可以參考下2014-04-04jquery.cookie.js實現(xiàn)用戶登錄保存密碼功能的方法
這篇文章主要介紹了jquery.cookie.js實現(xiàn)用戶登錄保存密碼功能的方法,結(jié)合實例形式詳細分析了jquery.cookie.js插件操作cookie實現(xiàn)保存用戶登錄信息的相關(guān)技巧,需要的朋友可以參考下2016-04-04jQuery實現(xiàn)鼠標響應(yīng)式淘寶動畫效果示例
這篇文章主要介紹了jQuery實現(xiàn)鼠標響應(yīng)式淘寶動畫效果,涉及jQuery事件響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)使用技巧,需要的朋友可以參考下2018-02-02