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实现页面加载时弹出对话框代码
Apr 19 Javascript
基于javascript滚动图片具体实现
Nov 18 Javascript
jQuery中closest和parents的区别分析
May 07 Javascript
原生js实现可爱糖果数字时间特效
Dec 30 Javascript
微信小程序开发(一) 微信登录流程详解
Jan 11 Javascript
js实现颜色阶梯渐变效果(Gradient算法)
Mar 21 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
Vue函数式组件-你值得拥有
May 09 Javascript
微信小程序实现注册登录功能(表单校验、错误提示)
Dec 10 Javascript
Vue项目结合Vue-layer实现弹框式编辑功能(实例代码)
Mar 11 Javascript
前端性能优化建议
Sep 17 Javascript
JS实现公告上线滚动效果
Jan 10 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中Date获取时间不正确怎么办
2008/06/05 PHP
php下使用strpos需要注意 === 运算符
2010/07/17 PHP
php 使用file_get_contents读取大文件的方法
2014/11/13 PHP
实现PHP+Mysql无限分类的方法汇总
2015/03/02 PHP
php获取linux命令结果的实例
2017/03/13 PHP
php多进程模拟并发事务产生的问题小结
2018/12/07 PHP
thinkPHP5框架路由常用知识点汇总
2019/09/15 PHP
Jquery命名冲突解决的五种方案分享
2012/03/16 Javascript
优化Jquery,提升网页加载速度
2013/11/14 Javascript
浅析JavaScript访问对象属性和方法及区别
2015/11/16 Javascript
jQuery数据类型小结(14个)
2016/01/08 Javascript
js事件处理程序跨浏览器解决方案
2016/03/27 Javascript
正则中的回溯定义与用法分析【JS与java实现】
2016/12/27 Javascript
vue element项目引入icon图标的方法
2018/06/06 Javascript
Vue中keep-alive的两种应用方式
2020/07/15 Javascript
详解uniapp的全局变量实现方式
2021/01/11 Javascript
python运行时间的几种方法
2016/06/17 Python
Python实现在线暴力破解邮箱账号密码功能示例【测试可用】
2017/09/06 Python
Python实现简单网页图片抓取完整代码实例
2017/12/15 Python
Python中摘要算法MD5,SHA1简介及应用实例代码
2018/01/09 Python
Python3.6.0+opencv3.3.0人脸检测示例
2018/05/25 Python
Python应用库大全总结
2018/05/30 Python
Python实现八皇后问题示例代码
2018/12/09 Python
Flask框架学习笔记之路由和反向路由详解【图文与实例】
2019/08/12 Python
python 多进程和协程配合使用写入数据
2020/10/30 Python
Python Selenium操作Cookie的实例方法
2021/02/28 Python
检测用户浏览器是否支持CSS3的方法
2009/08/29 HTML / CSS
HTML5之SVG 2D入门10—滤镜的定义及使用
2013/01/30 HTML / CSS
Html5 canvas实现粒子时钟的示例代码
2018/09/06 HTML / CSS
暇步士官网:Hush Puppies
2016/09/22 全球购物
Speedo澳大利亚官网:全球领先游泳品牌
2018/02/04 全球购物
德国2018年度最佳在线药房:Bodfeld Apotheke
2019/11/04 全球购物
国际贸易毕业生自荐书
2014/06/22 职场文书
护理专业自荐信范文
2015/03/06 职场文书
数学复习课教学反思
2016/02/18 职场文书
低版本Druid连接池+MySQL驱动8.0导致线程阻塞、性能受限
2021/07/01 MySQL