innerHTML中表单值不刷新在IE和火狐以及在在火狐当中outerHTML的解决方法

最近在做网站，由于不同类型的产品的参数不同，所以就用起将这些参数放到同一个字段中去（实在找不到其他的解决办法了，如果要为每个参数都建个字段，那产品表至少有200~300个字段）。页面上的解决办法是：将这些参数做成表格（里面有相应的表单），放到“产品类型”表中去。当添加这个产品时，根据用户选择的产品类型，调出不同的表格。所以在添加产品的时候，需要将这些表格显示到一个DIV中，提交的时候，使用javascript将这个div赋值给一个隐藏的表单，最后一起提交给数据库。
如下：

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<form name="form1" method="post" action="1.asp">
<div id="aaa">
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>ddd</td>
<td><input name="textfield" type="text" id="textfield" size="10" /></td>
</tr>
<tr>
<td>ddd1</td>
<td><input name="textfield2" type="text" id="textfield2" size="10" /></td>
</tr>
<tr>
<td>eee</td>
<td><input name="textfield3" type="text" id="textfield3" size="10" /></td>
</tr> 
</table>
</div>
</FORM>
<script language="javascript">
function f()
{
document.getElementById("a").value=document.getElementById("aaa").innerHTML;
}
</script>
<input type="button" name="button" id="button" value="提交" onClick="f()" />
<br />
<textarea name="a" cols="40" rows="5" id="a"></textarea>
</FORM>

这段代码在IE下一点问题都没有，你拿到火狐中运行一下看看。当在表单中输入内容时，再点击提交看看火狐能不能获取到输入到表单中的值。

为了找解决办法，发贴到csdn中去，得到朋友们的帮助，才知道这是火狐的一个BUG，这样是不能实现的。最后在另一个地方找到了答案。需要在文本框中失去焦点的时候，使用js给文本框赋值（this.setAttribute('value',this.value);）。
由于这个页面中的文本框的数量是不固定的，所以想起来使用jquery给所有文本都添加js给文件框赋值。

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<FORM name="form1" method="post" action="1.asp">
<div id="aaa">
<table width="200" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>ddd</td>
<td><input name="textfield" type="text" id="textfield" size="10" /></td>
</tr>
<tr>
<td>ddd1</td>
<td><input name="textfield2" type="text" id="textfield2" size="10" /></td>
</tr>
<tr>
<td>eee</td>
<td><input name="textfield3" type="text" id="textfield3" size="10" /></td>
</tr> 
</table>
</div>
</FORM>
<script language="javascript" src="http://www.aspprogram.cn/js/jquery.js"></script>
<script>
$("input").blur(function(){
this.setAttribute('value',this.value);
});  
</script>
<script language="javascript">
function f()
{
document.getElementById("a").value=document.getElementById("aaa").innerHTML;
}
</script>
<input type="button" name="button" id="button" value="提交" onClick="f()" />
<br />
<textarea name="a" cols="40" rows="5" id="a"></textarea>

再运行一下这段代码看看，是不是解决了？最后提交到数据库中的方法，写到action中的1.asp就可以了

原创文章：转载请注明来自：http://www.aspprogram.cn/ ，谢谢

2.  在火狐当中outerHTML的解决办法：

直接把以下段码插入到head当中

<!--
if(typeof(HTMLElement)!="undefined" && !window.opera)
{
HTMLElement.prototype.__defineGetter__("outerHTML",function()
{
var a=this.attributes, str="<"+this.tagName, i=0;for(;i<a.length;i++)
if(a[i].specified) str+=" "+a[i].name+'="'+a[i].value+'"';
if(!this.canHaveChildren) return str+" />";
return str+">"+this.innerHTML+"</"+this.tagName+">";
});
HTMLElement.prototype.__defineSetter__("outerHTML",function(s)
{
var d = document.createElement("DIV"); d.innerHTML = s;
for(var i=0; i<d.childNodes.length; i++)
this.parentNode.insertBefore(d.childNodes[i], this);
this.parentNode.removeChild(this);
});
HTMLElement.prototype.__defineGetter__("canHaveChildren",function()
{
return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
});
}
//-->