例子:
<table width="98%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<form id="form1" name="form1" action="program/survey/SurveyEdit.asp" method=post>
<td>
<table cellspacing="0" cellpadding="4" width="100%" border="0" class="tableborder">
<tr>
<td bgcolor="#C7E8F8">
<div align="center"><b>问题 1:</b> </div>
</td>
<td bgcolor="#C7E8F8">
<input size="60" name="Question1" class="tableborder">
</td>
</tr>
<tr>
<td> </td>
<td><b>问题类型: </b><input type="checkbox" value="True" name="chkQueType1" />
多选类型 <br />
<div name="__idQueOption1" id="__idQueOption1"><b>问题选项:</b>
<input onpropertychange="addNewChild(this)" size="60" name="QueOption1" class="tableborder" />
</div>
</td>
</tr>
</table>
<div id="__idInsertBefore"></div>
<input type="hidden" value="1" name="newTable">
<br />
<div align="right" style="padding:4px">
<input type=button onClick="addNewQuestion()" value="增加一个新问题" class="CustButton" />
<input type="submit" value="保存设置" class="CustButton">
<input type="reset" value="重新设置" class="CustButton">
</div>
</td>
</form>
</tr>
</table>
<script>
function addNewQuestion()
{document.form1.newTable.value = parseInt(document.form1.newTable.value) + 1;
var newItemId;
if( (document.form1.newTable.value).length > 2 )
{
alert("您的调查问题总数不能超过 99 个。")
window.location.reload();
}newItemId = document.form1.newTable.value;var objItem = '<table cellspacing="0" cellpadding="4" width="100%" border="0" class="tableborder">';
objItem += ' <tr>';
objItem += '<td bgcolor="#C7E8F8">';
objItem += ' <div align="center"><b>问题 ' + newItemId + ':</b> </div>';
objItem += ' </td>';
objItem += ' <td bgcolor="#C7E8F8">';
objItem += ' <input size="60" name="Question' + newItemId + '" class="tableborder">';
objItem += ' </td>';
objItem += ' </tr>';
objItem += ' <tr>';
objItem += ' <td> </td>';
objItem += ' <td><b>问题类型: </b><input type="checkbox" value="True" name="chkQueType' + newItemId + '">';
objItem += ' 多选类型 <br>';
objItem += ' <div id="__idQueOption' + newItemId + '"><b>问题选项:</b>';
objItem += ' <input onpropertychange="addNewChild(this)" size="60" name="QueOption' + newItemId + '" class="tableborder">';
objItem += ' </div>';
objItem += ' </td>';
objItem += ' </tr>';
objItem += '</table>';document.all.__idInsertBefore.insertAdjacentHTML("beforeBegin", objItem);
}function showTips(obj)
{
obj.title=obj.value;
}function addNewChild(obj)
{
var isblank = "false";
var objName = obj.name;
var last2Char = objName.substring(objName.length - 2);
if( last2Char.substring(0, 1) > '9' || last2Char.substring(0, 1) < '0' )
{
last2Char = last2Char.substring(1, 2);
}for(var i=0; i < document.form1.elements[objName].length; i++)
{
if(document.form1.elements[objName].item(i).value == "")
isblank = "yes"
}if( isblank != "yes" )
{
var objItem = '<div id="__idQueOption' + last2Char + '"><b>问题选项:</b>';
objItem += ' <input onpropertychange="addNewChild(this)" size="60" name="' + objName + '" class="tableborder" />';
objItem += '</div>';objName = "__idQueOption" + last2Char;
var varQueOption = document.all[objName];
if( varQueOption.length != null )
varQueOption = varQueOption.item(varQueOption.length-1);varQueOption.insertAdjacentHTML("afterEnd",objItem);
}
}
</script>
<table width="98%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<form id="form1" name="form1" action="program/survey/SurveyEdit.asp" method=post>
<td>
<table cellspacing="0" cellpadding="4" width="100%" border="0" class="tableborder">
<tr>
<td bgcolor="#C7E8F8">
<div align="center"><b>问题 1:</b> </div>
</td>
<td bgcolor="#C7E8F8">
<input size="60" name="Question1" class="tableborder">
</td>
</tr>
<tr>
<td> </td>
<td><b>问题类型: </b><input type="checkbox" value="True" name="chkQueType1" />
多选类型 <br />
<div name="__idQueOption1" id="__idQueOption1"><b>问题选项:</b>
<input onpropertychange="addNewChild(this)" size="60" name="QueOption1" class="tableborder" />
</div>
</td>
</tr>
</table>
<div id="__idInsertBefore"></div>
<input type="hidden" value="1" name="newTable">
<br />
<div align="right" style="padding:4px">
<input type=button onClick="addNewQuestion()" value="增加一个新问题" class="CustButton" />
<input type="submit" value="保存设置" class="CustButton">
<input type="reset" value="重新设置" class="CustButton">
</div>
</td>
</form>
</tr>
</table>
<script>
function addNewQuestion()
{document.form1.newTable.value = parseInt(document.form1.newTable.value) + 1;
var newItemId;
if( (document.form1.newTable.value).length > 2 )
{
alert("您的调查问题总数不能超过 99 个。")
window.location.reload();
}newItemId = document.form1.newTable.value;var objItem = '<table cellspacing="0" cellpadding="4" width="100%" border="0" class="tableborder">';
objItem += ' <tr>';
objItem += '<td bgcolor="#C7E8F8">';
objItem += ' <div align="center"><b>问题 ' + newItemId + ':</b> </div>';
objItem += ' </td>';
objItem += ' <td bgcolor="#C7E8F8">';
objItem += ' <input size="60" name="Question' + newItemId + '" class="tableborder">';
objItem += ' </td>';
objItem += ' </tr>';
objItem += ' <tr>';
objItem += ' <td> </td>';
objItem += ' <td><b>问题类型: </b><input type="checkbox" value="True" name="chkQueType' + newItemId + '">';
objItem += ' 多选类型 <br>';
objItem += ' <div id="__idQueOption' + newItemId + '"><b>问题选项:</b>';
objItem += ' <input onpropertychange="addNewChild(this)" size="60" name="QueOption' + newItemId + '" class="tableborder">';
objItem += ' </div>';
objItem += ' </td>';
objItem += ' </tr>';
objItem += '</table>';document.all.__idInsertBefore.insertAdjacentHTML("beforeBegin", objItem);
}function showTips(obj)
{
obj.title=obj.value;
}function addNewChild(obj)
{
var isblank = "false";
var objName = obj.name;
var last2Char = objName.substring(objName.length - 2);
if( last2Char.substring(0, 1) > '9' || last2Char.substring(0, 1) < '0' )
{
last2Char = last2Char.substring(1, 2);
}for(var i=0; i < document.form1.elements[objName].length; i++)
{
if(document.form1.elements[objName].item(i).value == "")
isblank = "yes"
}if( isblank != "yes" )
{
var objItem = '<div id="__idQueOption' + last2Char + '"><b>问题选项:</b>';
objItem += ' <input onpropertychange="addNewChild(this)" size="60" name="' + objName + '" class="tableborder" />';
objItem += '</div>';objName = "__idQueOption" + last2Char;
var varQueOption = document.all[objName];
if( varQueOption.length != null )
varQueOption = varQueOption.item(varQueOption.length-1);varQueOption.insertAdjacentHTML("afterEnd",objItem);
}
}
</script>
<form name="form1" method="post" action="d.asp">
<table width="100%" border="0" cellspacing="0" cellpadding="4" align="center" bgcolor="#F4FAFF" id="billboard">
<tr>
<td width="12%"><nobr>条目:</nobr></td>
<td width="38%">
<input type="text" name="text" style="width:100%" onpropertychange="addNewChild(this)" value="http://lucky.myrice.com" />
</td>
<td width="12%"><nobr>链接:</nobr></td>
<td width="38%">
<input type="text" name="href" style="width:100%" value="http://lucky.myrice.com" />
</td>
</tr>
<tr>
<td>条目:</td>
<td>
<input type="text" name="text" style="width:100%" onpropertychange="addNewChild(this)" />
</td>
<td>链接:</td>
<td>
<input type="text" name="href" style="width:100%" />
</td>
</tr>
</table>
<div id="textnew"></div>
<div align="right" style="padding:4px">
<input type="submit" value="保存设置" title="保存设置"></input>
<input value="重新填写" type="reset" onclick="document.form1.reset()" style="cursor:hand" title="重新设置"></input>
</div>
</td>
</tr>
</table>
</form><script>
function addNewChild(obj)
{
var isblank = "false"
for(var i=0;i<document.form1.elements[obj.name].length;i++)
{
if(document.form1.elements[obj.name].item(i).value == "")
isblank = "yes"
}
if (isblank != "yes")
{
var inputname = obj.name + "new"
inputname = inputname.toString()
var r = document.getElementById("billboard").insertRow(document.getElementById("billboard").rows.length)
var c
c = r.insertCell(0)
c.innerHTML = "条目:"
c = r.insertCell(1)
c.innerHTML = '<input type="text" name="text" style="width:100%" onpropertychange="addNewChild(this)">'
c = r.insertCell(2)
c.innerHTML = "链接: "
c = r.insertCell(3)
c.innerHTML = '<input type="text" name="href" style="width:100%">'
}
}
</script>
您给我的例子是在最后一个<input>框中输入值后,增加一行我的愿望是:在最后一个<input>中输入值后,要按下回车键后才增加,不管最后一个<input>中是否有值输入。换个说法:
<tr><td><input name=aaa[1]></td><td><input name=age[1]></td><td><input name=city[1]></td></tr>
当我在<input name=city[1]>处按下回车键后,增加:
<tr><td><input name=aaa[2]></td><td><input name=age[2]></td><td><input name=city[2]></td></tr>
当我在<input name=city[2]>处按下回车键后,增加:
<tr><td><input name=aaa[3]></td><td><input name=age[3]></td><td><input name=city[3]></td></tr> 一直增加到任意
用innerHTML出来的页面 就不能通过事件调用函数了吗???
<html>
<body id=aaa>
</body>
<script language="javascript">
onload=function() {
var i=1;
var sb="<form name=smj onkeydown=if(event.keyCode==13){event.keyCode=9;}>"
aaa.innerHTML=+sb;
document.writeln(sb);
var sb1="<td><input type=text name=name"+i+"></td>";
var sb2="<td><input type=text name=age"+i+"></td>";
var sb3="<td><input type=text name=city"+i+"></td>";//这里能不能调用函数function() 再增加一行????????????????????aaa.innerHTML=+sb1;
aaa.innerHTML=+sb2;
aaa.innerHTML=+sb3;document.writeln(sb1);
document.writeln(sb2);
document.writeln(sb3);
}
</script>
</html>
var sb3="<td><input type=text name=city"+i+" onclick='click_event();'></td>"
var sb3="<td><input type=text name=city"+i+" onclick='click_event();'></td>"您上边的改动完成后:
在IE中打开成为完全空白的页。
在Tencent Explorer中打开,报错:行:14
字符:1
错误:对象不支持此属性或方法!!!