首页 > 开发 > JS > 正文

js 点击事件 和循环 点击一次循环一次

2017-09-05 13:02:04  来源:网友分享

<html>
<head>
<script type="text/javascript">
for(i=0; i<7; i++)
{
document.getElementById("txt" +i).onclick = function(){
alert(this.value);
}
}
</script>
</head>

<body>
<input id="txt0" type="text" value="1">
<input id="txt1" type="text" value="2">
<input id="txt2" type="text" value="3">
<input id="txt3" type="text" value="4">
<input id="txt4" type="text" value="5">
<input id="txt5" type="text" value="6">
<input id="txt6" type="text" value="7">
</body>
</html>
请问要怎么写可以让我点txt0就跳出txt0的值 点txt1就跳出txt1的值而不是点一下就全部都跳出来请问要怎么写?

在请问一下怎么样可以把这两个分开呢 js 和 html

解决方案

你的JS应该是逻辑错误,我按你的意思改写如下:

<input id="txt0" type="text" value="1"><input id="txt1" type="text" value="2"><input id="txt2" type="text" value="3"><input id="txt3" type="text" value="4"><input id="txt4" type="text" value="5"><input id="txt5" type="text" value="6"><input id="txt6" type="text" value="7"><script type="text/javascript">    for(i=0; i<7; i++)    {    	document.getElementById("txt" +i).onclick = function(){	    	alert(this.value)        }    }</script>
分离JS和HTML
<script type="text/javascript">window.onload=function(){    for(i=0; i<7; i++)    {        document.getElementById("txt" +i).onclick = function(){                alert(this.value)        }    }}</script>

<input id="txt0" type="text" value="1">
<input id="txt1" type="text" value="2">
<input id="txt2" type="text" value="3">
<input id="txt3" type="text" value="4">
<input id="txt4" type="text" value="5">
<input id="txt5" type="text" value="6">
<input id="txt6" type="text" value="7">