js 动态绑定事件问题

本帖最后由 kaizi_sun 于 2010-09-17 15:46:02 编辑

解决方案 »

  1.   

    liobj.onmousedown指向getValue，等你for循环结束的时候，不管你点击那个，开始调用getValue，它的第二个参数str，又会找到o[i]，由于现在循环结束，i=4，所以会一直输出最后一个元素值。
      

  2.   

    恩有道理，但是怎么将动态循环参数放到 getValue去啊。 我已经晕了
      

  3.   

    这个是闭包问题啊！我改了下你的代码，看看这样行不行var h = 0;var ulobj =document.createElement("ul");
    for(i=0;i<o.length;i++){
      var liobj=document.createElement("li");
      var str=o[i];
      var values="txt|"+String(str);
      var pFunc =function(){getValue(values);};
      liobj.onmousedown=delegate(pFunc,values,liobj);  
      liobj.innerHTML=o[i];
      ulobj.appendChild(liobj);
      h=Number(h) + 20; }} function delegate(fn,params,obj){   
        return function(){   
            fn.call(obj||window,params);   
        }   function getValue(obj){var input=$(obj.split('|')[0]);input.value=obj.split('|')[1];}
      

  4.   

    每创建一次标签的id都是不同的，而楼主却给个固定的“tet”当然不管用了
      

  5.   

    可以使用闭包,这样改动不会很大var h = 0;var ulobj =document.createElement("ul");
    for(i=0;i<o.length;i++){
    (function(i){
      var liobj=document.createElement("li");
      var str=o[i];
      liobj.onmousedown=function(){getValue("txt",str);};
      liobj.innerHTML=o[i];
      ulobj.appendChild(liobj);
      h=Number(h) + 20;}).call(null,i) }} function getValue(obj,str){var input=$(obj);input.value=str;}
      

  6.   

    自己看着改吧：<body></body>
    <script type="text/javascript">
    var h = 0;
    var ulobj = document.createElement("ul");//for(i = 0; i < o.length; i++){
    for(i = 0; i < 5; i++){
    var liobj = document.createElement("li");
    // var str = o[i];
    var str = "o" + i;
    liobj.id = "o" + i;
    liobj.onmousedown = function(){
    // getValue(liobj.id, str);
    document.getElementById(this.id).innerHTML = str;
    }
    // liobj.innerHTML = o[i];
    liobj.innerHTML = "hahaha" + i;
    ulobj.appendChild(liobj);
    // h = Number(h) + 20;
    document.body.appendChild(ulobj);
    //}
    } //function getValue(id,str){
    // document.getElementById(id).innerHTML = str;
    //}
    </script>
      

  7.   


    var o = [1, 2, 3, 4, 5];var h = 0; 
    var ulobj =document.createElement("ul");
    for(i=0;i<o.length;i++){
      var liobj=document.createElement("li");
      var str=o[i];
       
      liobj.onmousedown=(function(){
          var s = str;
          return function(){
              getValue("txt", s);
          }  
      }());
      
      liobj.innerHTML=o[i];
      ulobj.appendChild(liobj);
      h=Number(h) + 20; 
      }
      
    document.body.appendChild(ulobj);
    function getValue(obj,str){var input=document.getElementById(obj);input.value=str;}
      

  8.   

    不是很明白LZ要的是什么效果(而且你代码没贴全，我看不懂那个h到底是干嘛的...)，看看是不是这个window.onload = function() {
      var o = ['abc', 'def', 'ghi', 'jkl', 'mno'];
      var oinp = document.createElement("INPUT");
      oinp.type = "text";
      oinp.id = "txt";
      document.body.appendChild(oinp);
      var oul = document.createElement("UL");
      for(var i=0; i<o.length; i++) {
        var oli = document.createElement("LI");
        oli.innerHTML = o[i];
        oli.onmousedown = function() { document.getElementById("txt").value = this.innerHTML };
        oul.appendChild(oli);
      }
      document.body.appendChild(oul);
    };根本没必要用到闭包什么的吧...
      

  9.   

    BTW，不觉得你的代码特别绕吗？？var h = 0;var ulobj =document.createElement("ul");
    for(i=0;i<o.length;i++){
      var liobj=document.createElement("li");
      // 创建了一个变量，就为了存一个早存在的数组元素
      var str=o[i];
      liobj.onmousedown=function(){getValue("txt",str);};
      // 又用到这个数组元素
      liobj.innerHTML=o[i];
      ulobj.appendChild(liobj);
      h=Number(h) + 20; }} 
    // 既然obj都是固定了，何必每次都去$(obj)？？直接在上面的代码中把引用直接指向它不就得了？
    function getValue(obj,str){var input=$(obj);input.value=str;}var h = 0;var ulobj =document.createElement("ul");
    var obj = $("txt");
    for(i=0;i<o.length;i++){
      var liobj=document.createElement("li");
      liobj.innerHTML=o[i];
      // 这里其实用匿名函数就可以了，除非还有很复杂的业务流程
      // liobj.onmousedown=function(){ obj.value = this.innerHTML; };
      liobj.onmousedown=function(){getValue(obj, this.innerHTML);};
      ulobj.appendChild(liobj);
      h=Number(h) + 20; }} function getValue(obj,str){ obj.value=str; }