如何将 js 里变量的值传给 innerHTML 作为变量使用
请参考
https://zhidao.baidu.com/question/209268511.html?qbl=relate_question_1&word=oListSong.innerHTML%C0%EF%C8%E7%BA%CE%D0%B4%B1%E4%C1%BF
原文问题如下:
我想批量增加一些资料,一开始只有一行,fname,lname,age,team,position,description, 最后是一个 Add one 按钮,我想实现点击 Add one 按钮就增加多一行,以便继续输入资料,但不知道如何将 js 里的变量值传入给 innerHTML 中作为变量使用,如下的 xx,如果当前只有一行,则xx=2,那么innerHTML 中的 firstname 的 name 属性值为 firstnamexx, 即为 firstname2,其它的一样
<HTML>
<HEAD>
<SCRIPT LANGUAGE="javascript">
function addOther(x){
var xx=x+1;
document.getElementById('count').value=document.getElementById('count').value+1;
alert(xx);
document.getElementById('addonemore').innerHTML="Fname:<INPUT TYPE=text ID=firstnamexx SIZE=10 NAME=firstnamexx>"; // xx 这里是不起作用的,如何让其起作用呢?我可不想写十个这样的语句
document.getElementById('addonemore').innerHTML+=" Lname:<INPUT TYPE=text ID=lastnamexx SIZE=10 NAME=lastnamexx>";
document.getElementById('addonemore').innerHTML+=" Age:<INPUT TYPE=text ID=age1 SIZE=3 NAME=agexx>";
document.getElementById('addonemore').innerHTML+=" Team:<INPUT TYPE=text ID=teamxx SIZE=10 NAME=teamxx>";
document.getElementById('addonemore').innerHTML+=" Position:<SELECT ID=selectxx NAME=selectxx><OPTION VALUE='Guard'>Guard<OPTION VALUE='Forward'>Forward<OPTION VALUE='Center'>Center</SELECT>";
document.getElementById('addonemore').innerHTML+=" Description:<TEXTAREA ID=description1 NAME=descriptionxx ROWS=5 COLS=15></TEXTAREA>";
document.getElementById('addonemore').innerHTML+="<INPUT TYPE=button ID=buttonxx NAME=buttonxx VALUE='Add onemore' onclick=\"addOther(xx)\">";
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME=addForm ACTION=<?php echo $_SERVER['PHP_SELF'];?> METHOD=POST>
Fname:<INPUT TYPE=text ID=firstname1 SIZE=10 NAME=firstname1>
Lname:<INPUT TYPE=text ID=lastname1 SIZE=10 NAME=lastname1>
Age:<INPUT TYPE=text ID=age1 SIZE=3 NAME=age1>
Team:<INPUT TYPE=text ID=team1 SIZE=10 NAME=team1>
Position:<SELECT ID=select1 NAME=select1>
<OPTION VALUE='Guard'>Guard
<OPTION VALUE='Forward'>Forward
<OPTION VALUE='Center'>Center
</SELECT>
Description:<TEXTAREA ID=description1 NAME=description1 ROWS=5 COLS=15></TEXTAREA>
<INPUT TYPE=button ID=button1 NAME=button1 VALUE="Add onemore" onclick="addOther(1)">
<P ID="addonemore"></P>
<INPUT TYPE=hidden ID=count NAME=count VALUE=1>
</FORM>
</BODY>
</HTML>
回答如下:
你注释不bai起作用的地方改成这样:du
document.getElementById('addonemore').innerHTML="Fname:<input type='text' id='firstname"+xx+"' size='10' name='firstname"+xx+"'>"
还有一点:x=1时,var xx=x+1;要想得到zhixx=2的结果,应该写成var xx=parseInt(x)+1;否则,js默认daox为字符类型,xx将为01;