search

Home  >  Q&A  >  body text

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

<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

天蓬老师天蓬老师2896 days ago803

reply all(5)I'll reply

  • PHP中文网

    PHP中文网2017-04-10 12:46:48

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

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    <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" t

    ype="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

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    <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">

    reply
    0
  • PHP中文网

    PHP中文网2017-04-10 12:46:48

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    function clicks(i)

    {

        alert(document.getElementById("txt" +i).value)

    }

     

    <input id="txt0" type="text" value="111" onclick="clicks(0)">

    <input id="txt1" type="text" value="111" onclick="clicks(1)">

    <input id="txt2" type="text" value="111" onclick="clicks(2)">

    <input id="txt3" type="text" value="111" onclick="clicks(3)">

    <input id="txt4" type="text" value="111" onclick="clicks(4)">

    <input id="txt5" type="text" value="111" onclick="clicks(5)">

    <input id="txt6" type="text" value="111" onclick="clicks(6)">

    reply
    0
  • ringa_lee

    ringa_lee2017-04-10 12:46:48

    <html>
    <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>

    <script type="text/javascript">
    function selectTr(value)
    {
    selectOneRow(value);
    }
    function selectOneRow(value)
    {
    alert(value);
    }
    for(i=0; i<7; i++)
    {
    var input = document.getElementById("txt"+i);
    var value = input.value;
    input.setAttribute("onclick", "selectTr("+value+")");
    }
    </script>
    </html>

    reply
    0
  • ringa_lee

    ringa_lee2017-04-10 12:46:48

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    window.onload=function(){

             var addHandler=function(element, type, handler){

                if(element.addEventListener){

              element.addEventListener(type, handler, false);

            } else if(element.attachEvent){

              element.attachEvent("on" + type, handler);

            } else {

              element["on" + type] = handler;

            }

          };

        list=document.getElementsByTagName('input');

        for(var i=0,len=list.length;i<len;i++){

            addHandler(list[i],'click',function(){

                event=event||window.event;

                target=event.target||srcElement.target;

                alert(target.id);

            })

        }

    }

    reply
    0
  • 巴扎黑

    巴扎黑2017-04-10 12:46:48

    var tt1=document.getElementById("test1").getElementsByTagName("input"); for(var j=0;j<tt1.length;j++) { tt1[j].onclick=function() { var abc=this.value; alert(abc); }
    }

    reply
    0
  • Cancelreply