jquery html()方法在firefox中无法获取到dom改变

故增加一个方法,代码如下:当然,可以直接用此方法代替html()方法

jquery的html()方法很容易实现。但是测试的时候发现,在ie8和i火狐(还包括ie9,safari,谷歌浏览器)中,html()得到的值是不一样的

 代码如下 复制代码

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery.tools.min.js"></script>
<script>
function save(){
     var content = $("#mytable").html();
    alert(content);
}
</script>
</head>

<body>
<table width="100"  border="0" cellpadding="0" cellspacing="0"  id="mytable">
<tbody>
  <tr>
    <td><input type="text" name="textfield"></td>
  </tr>
  <tr>
    <td><input type="button" name="Submit" value="保存" onClick="save()"></td>
    </tr>
</tbody>
</table>
</body>
</html>

效果如下

点击按钮以后的结果如下(注意我画框的地方):

ie8

ie9,火狐

 

也就是说,FF下获得的HTML只有最原始的代码,不包括动态插入的内容。这样就很纠结,我不希望这样。

至于为什么会这样,也许是火狐等浏览器的限制?我真的不知道,有待研究,哪位大侠能告诉我,感激不尽。

现在我只能尽快想办法解决这个问题,完成工作要求

解决办法

 代码如下 复制代码

jQuery html() in Firefox (uses .innerHTML) ignores DOM changes
Firefox doesn’t update the value attribute of a DOM object based on user input, just its valueproperty - pretty quick work around exists.

(function($) {
var oldHTML = $.fn.html;

$.fn.formhtml = function() {
if (arguments.length) return oldHTML.apply(this,arguments);
$(“input,textarea,button”, this).each(function() {
this.setAttribute(‘value’,this.value);
});
$(“:radio,:checkbox”, this).each(function() {
// im not really even sure you need to do this for ”checked”
// but what the heck, better safe than sorry
if (this.checked) this.setAttribute(‘checked’, ’checked’);
else this.removeAttribute(‘checked’);
});
$(“option”, this).each(function() {
// also not sure, but, better safe…
if (this.selected) this.setAttribute(‘selected’, ’selected’);
else this.removeAttribute(‘selected’);
});
return oldHTML.apply(this);
};

//optional to override real .html() if you want
// $.fn.html = $.fn.formhtml;
})(jQuery);

时间: 2025-01-28 03:23:05

jquery html()方法在firefox中无法获取到dom改变的相关文章

Jquery attr()方法 属性赋值和属性获取详解_jquery

jquery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写,在jQuery DOM操作中会经常用到attr(),attr()有4个表达式. 1.  attr( 属性名 )        //获取属性的值(取得第一个匹配元素的属性值.通过这个方法可以方便地从第一个匹配元素中获取一个属性的值.如果元素没有相应属性,则返回 undefined ) 2.  attr( 属性名, 属性值 )    //设置属性的值 (为所有匹配的元素设置一个属性值.) 3.  att

ie兼容性-jquery的方法在ie中不好使

问题描述 jquery的方法在ie中不好使 这是我的代码: 加入 取消 <input type="hidden" value="${item.merchant_cids!''}" class="merchant_cids"> js: $(".merchant_cids").each(function(){ var s = $(this).val(); var sArr = s.split(","

jquery text()方法取标签中的文本_jquery

<span id="236" class="active" type="teacher" ww="nn"> <input type="checkbox" onclick="event.cancelBubble=true;"> 刘4 </span> 获取文本"刘4" 获取id $("input:checked",&

在Firefox中如何通过鼠标拖动改变层的大小

问题描述 在页面中有上下两个层,通过鼠标拖动可以在不移动的位置的情况下,改变其第二个层的大小,并能覆盖第一个层,点击第二个层上的"恢复"按钮,可恢复这两个层的原始位置.在IE中好用,但在火狐中无效果.代码如下:<html><head><metaname="keywords"content="站长,网页特效,js特效,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效网"/><

浅谈jQuery this和$(this)的区别及获取$(this)子元素对象的方法_jquery

1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? 首先来看看JQuery中的  $()  这个符号,实际上这个符号在JQuery中相当于JQuery(),即$(this)=jquery();也就是说,这样可以返回一个jquery对象.那么,当你在网页中alert($('#id'));时,会弹出一个[object Object ],这个object对象,也就是jquery对象了. 那么,我们

总结js在IE与FireFox中不同的用法区别

总结js在ie与firefox中不同的用法区别 1. document.form.item 问题 问题: 现有代码中存在许多 document.formname.item("itemname") 这样的语句,不能在firefox下运行 解决方法: 统一使用 document.formname.elements["elementname"]          2. 集合类对象问题   问题: ie下,可以使用()或[]获取集合类对象:firefox下,只能使用[]获取

Javascript在IE和FireFox中的不同表现简析_javascript技巧

1.document.formName.item("itemName") 问题 说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];Firefox下,只能使用document.formName.elements["elementName"]. 解决方法:统一使用document.formName.elem

jQuery实现从身份证号中获取出生日期和性别的方法分析_jquery

本文实例分析了jQuery实现从身份证号中获取出生日期和性别的方法.分享给大家供大家参考,具体如下: 一.前言: 今天,在做移动端的项目中,按照设计稿的要求,是可以让用户自己输入出生日期的,我还很认真的用了刚刚知道的html5表单的日期类型,本想着终于不用日期插件就可以实现用户选择自己的出生日期了,可结果老大说,把这个表单去掉,要做成从身份证号里边读取用户的出生日期.好吧,高兴了一半,结果....唉,没办法,只能按照领导的要求来做啊,于是就有了下边的从身份证号中获取出生日期和性别的代码. 二.实

解决jQuery.ajax在IE, FireFox可以正常执行。Chrome,360极速模式中无法正常执行。

解决jQuery.ajax在IE, FireFox可以正常执行.Chrome,360极速模式中无法正常执行. 今天遇到问题,已经搞了半天了,总结一下. 找到:http://forum.jquery.com/topic/load-and-ajax-not-working-on-google-chrome Using jQuery 里面有个人说的原文如下:   Please look at this page:http://www.mail-archive.com/qooxdoo-devel@lis