请教一个关于循环的问题

本帖最后由 wxxcarl 于 2011-04-08 08:59:44 编辑

解决方案 »

  1.   

    for(var i=1;i<=5;i++){
    var pre=document.getElementById("pre"+i);
    var next=document.getElementById("next"+i);
    next.index=i;
    pre.index=i;
    next.onclick=function(){
    var input=document.getElementById("input"+this.index);
    input.value= parseInt(input.value)++;
    }
    pre.onclick=function(){
    var input=document.getElementById("input"+this.index);
    input.value= parseInt(input.value)--;
    }
    }
      

  2.   

    var pre=document.getElementById("pre"+i);
    var next=document.getElementById("next"+i);
    var input=document.getElementById("input"+i);
    next.onclick=function(i,input){
    //input.value++;
    return function(){
    input.value++;
    }
    }(i,input);
    pre.onclick=function(i,input){
    //input.value--;
    return function(){
    input.value--;
    }
    }(i,input);
      

  3.   

    经典的闭包问题.多种解决方式。<style>
    div{padding:2px 5px;background:#ff0000;float: left;}
    input{float: left;}
    </style>
    <body>
        <div id="pre1">-</div> <input id="input1"> <div id="next1">+</div><br><br>
        <div id="pre2">-</div> <input id="input2"> <div id="next2">+</div><br><br>
        <div id="pre3">-</div> <input id="input3"> <div id="next3">+</div><br><br>
        <div id="pre4">-</div> <input id="input4"> <div id="next4">+</div><br><br>
        <div id="pre5">-</div> <input id="input5"> <div id="next5">+</div>
    </body>
    <script>
    for(var i=1;i<=5;i++){
    var pre=document.getElementById("pre"+i);
    var next=document.getElementById("next"+i);
    (function(){
    var temp = i;
    var input=document.getElementById("input"+i);
    next.onclick=function(){
      input.value++;
    }
    pre.onclick=function(){
      input.value--;
    }})();
    }
    </script>