<%@ page language="java" pageEncoding="GBK"%>
<%@include file="/website/include/import.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="x-ua-compatible" content="ie=7" />
<title>资助</title>
</head>
<body style="background:none" >
<table width="640" border="0" cellpadding="0" cellspacing="1" bgcolor="#FFFFFF"  id="tab">
  <tr style="font-weight:bold; font-size:14px">
    <td width="77" height="30" align="center" valign="middle" bgcolor="#FFCCCC">序号</td>
    <td width="366" align="center" valign="middle" bgcolor="#FFCCCC">用途(项目)</td>
    <td width="108" align="center" valign="middle" bgcolor="#FFCCCC">金额</td>
    <td width="84" align="center" valign="middle" bgcolor="#FFCCCC">日期</td>
  </tr>
  <tr bgcolor="#fd6b6c"><td colspan=4 height="30"><div style="float:left;margin-left:10px;"><img src="images/add.gif" style="cursor:pointer;" onclick="addTr()"/></div><div style="float:right;color:#fff;font-weight:bold;font-size:14px;padding-top:5px;" >余额:<span id="leaveMoney"></span></div></td></tr>
</table>
<script>
function addTr()
{
var t = document.getElementById("tab"); //首先获得这个表格
var tr = t.insertRow(t.rows.length-1); //为该表格添加行,参数为0代表添加到第一行
if(t.rows.length%2==0)
tr.style.cssText='background:#fff7d7;';
var td = tr.insertCell(0); //添加一列
if(navigator.appName.indexOf("Explorer") > -1){ 
td.innerText =t.rows.length-2 ;
} else{ 
td.textContent =t.rows.length-2 ;
} td.setAttribute("style","text-align:center;");
td.style.cssText='text-align:center;'
var programeinput = document.createElement("input");
programeinput.setAttribute("type","text");
programeinput.setAttribute("size","56"); 
programeinput.setAttribute("height","26"); 
programeinput.setAttribute("name","programe");
programeinput.setAttribute("maxlength","50");
programeinput.style.cssText='font-size:14px;'
td = tr.insertCell(1); //添加一列
td.appendChild(programeinput);
var moneyinput = document.createElement("input");
moneyinput.setAttribute("type","text");   
moneyinput.setAttribute("name","money");
moneyinput.setAttribute("size","15"); 
moneyinput.setAttribute("height","26"); 
moneyinput.style.cssText='font-size:14px;'
moneyinput.attachEvent("onkeyup",newclearNoNum(moneyinput));
moneyinput.attachEvent("onblur",getNum);
td = tr.insertCell(2); 
td.appendChild(moneyinput);  
var dayinput = document.createElement("input");
dayinput.setAttribute("type","text");   
dayinput.setAttribute("name","day"); 
dayinput.setAttribute("size","11"); 
dayinput.setAttribute("height","26");
dayinput.setAttribute("readonly","true");
dayinput.setAttribute("maxlength","10");
dayinput.style.cssText='font-size:14px;'
dayinput.attachEvent("onclick",newshowCal(dayinput));
td = tr.insertCell(3);
td.appendChild(dayinput);
}
function showCal(obj)
{
if (!obj) var obj = event.srcElement;
var obDate;
if ( obj.value == "" ) {
obDate = new Date();
} else {
var obList = obj.value.split( "-" );
obDate = new Date( obList[0], obList[1]-1, obList[2] );
}var retVal = showModalDialog( "/system/common/calendar/calendar.htm", obDate,
"dialogWidth=206px; dialogHeight=206px; help=no; scroll=no; status=no; " );if ( typeof(retVal) != "undefined" ) {
var year = retVal.getFullYear();
var month = retVal.getMonth()+1;
var day = retVal.getDate();
obj.value =year + "-" + month + "-" + day;
}
}
var newshowCal = function(obj)
{
  return function()
  {
    showCal(obj);//该函数为外部定义的一个执行函数;
  }
}
function clearNoNum(obj)
{
obj.value = obj.value.replace(/[^\d.]/g,"");
                  obj.value = obj.value.replace(/^\./g,"");
obj.value = obj.value.replace(/\.{2,}/g,".");
obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
}
var newclearNoNum = function(obj)
{
  return function()
  {
    clearNoNum(obj);//该函数为外部定义的一个执行函数;
  }
}
function getNum(){
var Moneys = document.getElementsByName("money");
var total=0;
if(Moneys)
{
for(var i=0;i<Moneys.length;i++){

total+=parseInt(Moneys[i].value);
}
}
if(navigator.appName.indexOf("Explorer") > -1){ 
document.getElementById("leaveMoney").innerText =total;
} else{ 
document.getElementById("leaveMoney").textContent =total;

}
function subResult()
{
}
</script>
</html>我动态创建了input type="text" 对象为什么点增加了后 document.getElementsByName("money")获取不到呢?应该怎么解决!

解决方案 »

  1.   

    给你一个最简单的方法<script>var programeinput ;function addTr()
    {
    ...
    programeinput = document.createElement("input");
    ...}</script>用全局变量  这样你创建的对象就保存下来了还有很多方法解决  
    moneyinput.setAttribute("name","money");
    moneyinput.setAttribute("id","money");document.getElementsByName("money")肯定是可以获得的  
      

  2.   

    记住  set属性的时候set  Id  
      

  3.   

    也许JS底层没有把DOM结构刷新得那么彻底。。
     同楼上,认为可以保存为全局。
      虽然getbyname不能得到  但是  getbyid是可以的 如果LZ一定要用name得到  添加的时候用 innerHTML  这个会彻底刷新DOM结构
      但是不推荐这么做
      

  4.   

    看了下动态出来的html 。
    input其他属性都有 ,唯独name没有 。
    setAttribute("name","money");按道理这样也没错 。
      

  5.   

    根据各位意见,通过set属性的时候set Id解决了问题,为什么呢?我记得id可是唯一的标识。为什么只有这样可以获取到对象呢。
      

  6.   

    w3c规范中getElementsByName是按着name属性进行检索的,而MS的IE却是按着id来检索。导致不能得到应该得到的Elements,为适应浏览器,我们可以做一下调整:把需要用getElementsByName的name都加上id,且id和name相同。貌似就只有这个方法了
    在FF调试了一下,发现几个错误
    1、你动态创建了input type="text" 对象为什么点增加了后 document.getElementsByName("money")获取不到的原因是代码顺序有问题
    应该是先appendChild()后再添加相应的事件td = tr.insertCell(3);
    td.appendChild(dayinput);
    //再添加事件处理操作
    moneyinput.attachEvent("onkeyup",newclearNoNum(moneyinput));
    moneyinput.attachEvent("onblur",getNum);
    可是有一个问题,FF下不支持attachEvent操作
    IE 支持 attachEvent
    FF 支持addEventListener
    我将你的代码稍微改了一下,在FF、IE下都能实现效果
    <body style="background: none">
        <table width="640" border="0" cellpadding="0" cellspacing="1" bgcolor="#FFFFFF" id="tab">
            <tr style="font-weight: bold; font-size: 14px">
                <td width="77" height="30" align="center" valign="middle" bgcolor="#FFCCCC">
                    序号
                </td>
                <td width="366" align="center" valign="middle" bgcolor="#FFCCCC">
                    用途(项目)
                </td>
                <td width="108" align="center" valign="middle" bgcolor="#FFCCCC">
                    金额
                </td>
                <td width="84" align="center" valign="middle" bgcolor="#FFCCCC">
                    日期
                </td>
            </tr>
            <tr bgcolor="#fd6b6c">
                <td colspan="4" height="30">
                    <div style="float: left; margin-left: 10px;">
                        <input type="button" value="操作" onclick="addTr()" /></div>
                    <div style="float: right; color: #fff; font-weight: bold; font-size: 14px; padding-top: 5px;">
                        余额:<span id="leaveMoney"></span></div>
                </td>
            </tr>
        </table>    <script>
            function addTr() {
                var t = document.getElementById("tab"); //首先获得这个表格
                var tr = t.insertRow(t.rows.length - 1); //为该表格添加行,参数为0代表添加到第一行
                if (t.rows.length % 2 == 0)
                    tr.style.cssText = 'background:#fff7d7;';
                var td = tr.insertCell(0); //添加一列
                if (navigator.appName.indexOf("Explorer") > -1) {
                    td.innerText = t.rows.length - 2;
                }
                else {
                    td.textContent = t.rows.length - 2;
                }
                td.setAttribute("style", "text-align:center;");
                td.style.cssText = 'text-align:center;'
                var programeinput = document.createElement("input");
                programeinput.setAttribute("type", "text");
                programeinput.setAttribute("size", "56");
                programeinput.setAttribute("height", "26");
                programeinput.setAttribute("name", "programe");
                programeinput.setAttribute("maxlength", "50");
                programeinput.style.cssText = 'font-size:14px;'
                td = tr.insertCell(1); //添加一列
                td.appendChild(programeinput);
                var moneyinput = document.createElement("input");
                moneyinput.setAttribute("type", "text");
                moneyinput.setAttribute("name", "money");
                moneyinput.setAttribute("size", "15");
                moneyinput.setAttribute("height", "26");
                moneyinput.setAttribute("id", "money");
                moneyinput.style.cssText = 'font-size:14px;'
                td = tr.insertCell(2);
                td.appendChild(moneyinput);
                if (window.addEventListener) {
                    moneyinput.addEventListener("blur", getNum, false);
                    moneyinput.addEventListener("keyup", newclearNoNum(moneyinput), false);
                }
                else {
                    moneyinput.attachEvent("onkeyup", newclearNoNum(moneyinput));
                    moneyinput.attachEvent("onblur", getNum);
                }
                var dayinput = document.createElement("input");
                dayinput.setAttribute("type", "text");
                dayinput.setAttribute("name", "day");
                dayinput.setAttribute("size", "11");
                dayinput.setAttribute("height", "26");
                dayinput.setAttribute("readonly", "true");
                dayinput.setAttribute("maxlength", "10");
                dayinput.style.cssText = 'font-size:14px;'
                td = tr.insertCell(3);
                td.appendChild(dayinput);
                if (window.addEventListener) {
                    moneyinput.addEventListener("click", newshowCal(dayinput), false);
                }
                else {
                    dayinput.attachEvent("onclick", newshowCal(dayinput));
                }
            }
            function showCal(obj) {
                if (!obj) var obj = event.srcElement;
                var obDate;
                if (obj.value == "") {
                    obDate = new Date();
                } else {
                    var obList = obj.value.split("-");
                    obDate = new Date(obList[0], obList[1] - 1, obList[2]);
                }            var retVal = showModalDialog("/system/common/calendar/calendar.htm", obDate,
    "dialogWidth=206px; dialogHeight=206px; help=no; scroll=no; status=no; ");            if (typeof (retVal) != "undefined") {
                    var year = retVal.getFullYear();
                    var month = retVal.getMonth() + 1;
                    var day = retVal.getDate();
                    obj.value = year + "-" + month + "-" + day;
                }
            }
            var newshowCal = function(obj) {
                return function() {
                    showCal(obj); //该函数为外部定义的一个执行函数;
                }
            }
            function clearNoNum(obj) {
                obj.value = obj.value.replace(/[^\d.]/g, "");
                obj.value = obj.value.replace(/^\./g, "");
                obj.value = obj.value.replace(/\.{2,}/g, ".");
                obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
            }
            var newclearNoNum = function(obj) {
                return function() {
                    clearNoNum(obj); //该函数为外部定义的一个执行函数;
                }
            }
            function getNum() {
                var Moneys = document.getElementsByName("money");
                var total = 0;
                if (Moneys) {
                    for (var i = 0; i < Moneys.length; i++) {
                        total += parseInt(Moneys[i].value);
                    }
                }
                if (navigator.appName.indexOf("Explorer") > -1) {
                    document.getElementById("leaveMoney").innerText = total;
                } else {
                    document.getElementById("leaveMoney").textContent = total;
                }
            }
            function subResult() {
            }
        </script>
      

  7.   

    创建元素的语法改下,改成这个:
    document.createElement("<input name='XXX'>");
    *.setAttribute("name","XXX")//就要删除了。JavaScript创建元素的时候不能用setAttribute决定元素的name好像是因为和锚有关系。