UC知道JavaScript中输入数字转换图片（代码如下）
来源：百度知道 编辑：UC知道 时间：2024/05/31 12:28:55
问题是，当我输入数字的时候，图片只能显示出第一个数字，为什么呢？希望高人指点！
<input type=text id=ShuRuNum>
<button onclick="Chenge();">转换</button><br><br>
<span id=ShuChuPic></span>
</div>
<script language=javascript>
var shuzi=ShuRuNum.value;
var changdu=shuzi.length;
function Chenge()
{
for(i=0;i<=changdu;i++)
{
var inum
var sresult="";
inum=parseInt(ShuRuNum.value.charAt(i))
sresult=sresult+"<img src=./pic"+inum+".jpg>"
ShuChuPic.innerHTML=sresult
alert(ShuRuNum.value)
}
}
</script>
</body>
</html>
<input type=text id=ShuRuNum>
<button onclick="Chenge();">转换</button><br><br>
<span id=ShuChuPic></span>
</div>
<script language=javascript>
var shuzi=ShuRuNum.value;
var changdu=shuzi.length;
function Chenge()
{
for(i=0;i<=changdu;i++)
{
var inum
var sresult="";
inum=parseInt(ShuRuNum.value.charAt(i))
sresult=sresult+"<img src=./pic"+inum+".jpg>"
ShuChuPic.innerHTML=sresult
alert(ShuRuNum.value)
}
}
</script>
</body>
</html>
首先，changdu这个变量没有传递好，导致循环没有正常运行，实际中就执行了一遍而已。
其次，就算循环正常了，你的每次循环，都把sresult这个变量给清空一次。
所以你不能得到想要的结果。
还有，你写代码，不太规范啊，而且js有时不写结束符分号，这个也不是好习惯啊。
下面是参考代码：
<input type="text" id="ShuRuNum" />
<button onclick="Chenge();">转换</button><br /><br />
<span id="ShuChuPic"></span>
<script language="javascript">
function Chenge()
{
var shuzi=ShuRuNum.value;
var changdu=shuzi.length -1;
var sresult="";
//alert(changdu);
for(i=0;i<=changdu;i++)
{
var inum;
inum=parseInt(ShuRuNum.value.charAt(i));
sresult=sresult+"<img src=./pic"+inum+".jpg />";
ShuChuPic.innerHTML=sresult;
//alert(ShuRuNum.value);
}
}
</script>
ShuChuPic.innerHTML=sresult
这一句错了 改成 ShuChuPic.innerHTML+=sresult