jquery在ie7下选择器的问题导致append失效的解决方法


Posted in Javascript onJanuary 10, 2016

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动态填充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上去,诸如<b><p>这些完全没有问题,可是碰到了带链接的HTML如:

$("#test").append("<a href='#'>test</a>");

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的源代码是怎么写的吧。
Javascript 相关文章推荐
jquery cookie插件代码类
May 26 Javascript
!DOCTYPE声明对JavaScript的影响分析
Apr 12 Javascript
jQuery contains过滤器实现精确匹配使用方法
Apr 12 Javascript
用JS在浏览器中创建下载文件
Mar 05 Javascript
JavaScript字符串对象split方法入门实例(用于把字符串分割成数组)
Oct 16 Javascript
js中this的用法实例分析
Jan 10 Javascript
Javascript显示和隐藏ul列表的方法
Jul 15 Javascript
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
Nov 17 Javascript
VUE利用vuex模拟实现新闻点赞功能实例
Jun 28 Javascript
分析JavaScript数组操作难点
Dec 18 Javascript
小程序分享模块超级详解(推荐)
Apr 10 Javascript
Node.js fs模块(文件模块)创建、删除目录(文件)读取写入文件流的方法
Sep 03 Javascript
基于Node.js的强大爬虫 能直接发布抓取的文章哦
Jan 10 #Javascript
JavaScript基础知识及常用方法总结
Jan 10 #Javascript
jQuery实现的调整表格行tr上下顺序
Jan 10 #Javascript
javascript实现checkbox复选框实例代码
Jan 10 #Javascript
基于javascript实现彩票随机数生成(升级版)
Apr 17 #Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
Jan 10 #Javascript
理解Angular数据双向绑定
Jan 10 #Javascript
You might like
PHP中PDO的错误处理
2011/09/04 PHP
国外PHP程序员的13个好习惯小结
2012/02/20 PHP
php获取远程图片并下载保存到本地的方法分析
2016/10/08 PHP
PHP中函数gzuncompress无法使用的解决方法
2017/03/02 PHP
PHP实现查询手机归属地的方法详解
2017/04/28 PHP
PHP单例模式与工厂模式详解
2017/08/29 PHP
JavaScript 变量命名规则
2009/09/23 Javascript
jquery中防刷IP流量软件影响统计的一点对策
2011/07/10 Javascript
基于jQuery的弹出框插件
2012/03/18 Javascript
jQuery语法总结和注意事项小结
2012/11/11 Javascript
jquery中get,post和ajax方法的使用小结
2014/02/04 Javascript
js 采用delete实现继承示例代码
2014/05/20 Javascript
jQuery基础语法实例入门
2014/12/23 Javascript
jQuery实现的简单提示信息插件
2015/12/08 Javascript
JavaScript设计模式经典之命令模式
2016/02/24 Javascript
关于function类中定义变量this的简单说明
2016/05/28 Javascript
vue元素实现动画过渡效果
2017/07/01 Javascript
微信小程序实时聊天WebSocket
2018/07/05 Javascript
vuejs简单验证码功能完整示例
2019/01/08 Javascript
vue2路由方式--嵌套路由实现方法分析
2020/03/06 Javascript
JavaScript面试中常考的字符串操作方法大全(包含ES6)
2020/05/10 Javascript
原生js+canvas实现贪吃蛇效果
2020/08/02 Javascript
Python 匹配任意字符(包括换行符)的正则表达式写法
2009/10/29 Python
用python写asp详细讲解
2013/12/16 Python
python中__call__方法示例分析
2014/10/11 Python
Python-嵌套列表list的全面解析
2016/06/08 Python
Python3中简单的文件操作及两个简单小实例分享
2017/06/18 Python
python 多线程串行和并行的实例
2019/02/22 Python
编译 pycaffe时报错:fatal error: numpy/arrayobject.h没有那个文件或目录
2020/11/29 Python
HTML5头部标签的一些常用信息小结
2016/10/23 HTML / CSS
Expedia挪威官网:酒店、机票和租车
2018/03/03 全球购物
澳大利亚音乐商店:Bava’s Music City
2019/05/05 全球购物
希腊品牌鞋类销售网站:epapoutsia.gr
2020/03/18 全球购物
会计专业毕业生自荐信范文
2013/12/20 职场文书
辅导员学期工作总结
2015/08/14 职场文书
实现AJAX异步调用和局部刷新的基本步骤
2022/03/17 Javascript