事件處理程序不工作的動態附件

我只是在js中嘗試一個小實驗。這是這樣的;我有一個ul和低於約5 li，現在我附上的事件處理程序點擊一號li，使用選擇象下面這樣：事件處理程序不工作的動態附件

 var elem = $('ul li:nth-child('+ i +')');

現在我添加了功能芬克，就像這樣：

var funk = function() { 
    return i < 5 ? i++ : i = 0 ; 
}

現在我希望發生的是一旦第一li被點擊，我希望事件處理程序連接到下一個li，當我點擊li，單擊事件應附後的li依此類推......

現在，我寫了下面的代碼至今：

  var i = 0; 

      $('document').ready(function(){ 
       str = funk(); 
       console.log(str); 

        var elem = $('ul li:nth-child('+ i +')'); 

        elem.on('click' , function(){ 
         console.log('logged'); 
         funk(); 
        }); 
      }); 

      var funk = function() { 
        return i < 5 ? i++ : i = 0 ; 
      }

現在有代碼中的一些明顯的錯誤，我不能夠熨平，由於某種原因，funk()功能簡化版，本身功能因爲我永遠不會增加。

有人可以幫我附加一個動態事件處理程序嗎？

FIDDLE HERE

AE-X。

來源

2015-06-28 Alexander Solonik

[Up Dated小提琴]（http://jsfiddle.net/0nw4d43f/2/） – ozil

@ozil我教過js有變量提升，在運行時將所有變量放在任何其他代碼之前。 –

你的代碼是正確的，問題在於聲明。在被調用之前移動func定義。

問題在於func函數。它是一個變量，所以它最初被聲明並設置爲undefined，然後所有行都會被執行，但func是未定義的，所以它會拋出錯誤。

來源

2015-06-28 11:28:29 Captain

我爲它創建了一個遞歸解決方案。這僅在點擊

$(document).ready(function() { 
 
    var i = 1; 
 
    addEventHandlerForNextItem(i); 
 

 
    function addEventHandlerForNextItem(num) { 
 
    var elem = $('ul li:nth-child(' + num + ')'); 
 
    elem.on('click', function() { 
 
     console.log('element:' + elem[0].textContent); 
 
     alert('element:' + elem[0].textContent); 
 
     i = i + 1; 
 
     addEventHandlerForNextItem(i); 
 
    }); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>1</li> 
 
    <li>2</li> 
 
    <li>3</li> 
 
</ul>

來源

2015-06-28 11:44:34

不是prittest增加了處理程序下一個列表項，但我繼承人如何設法連接的動態事件處理程序::

  var i = 1; 

      var funk = function() { 
        return i < 5 ? ++i : i = 1 ; 
      } 

      changeHanderler = function(){ 
       str = funk(); 
       console.log(str); 
       var elem = $('ul li:nth-child('+ i +')'); 
       elem.on('click.ga' , function(){ 
        console.log('logged'); 
        elem.off('click.ga'); 
        changeHanderler(); 
       }); 

      } 

      $('document').ready(function(){ 
       elem = $('ul li:nth-child('+ i +')'); 

       elem.on('click.ga' , function(){ 
        changeHanderler(); 
        console.log('logged'); 
        elem.off('click.ga'); 
       }); 

      });

沒有的pritty但有效，也過度使用on()和off() jquery函數，也許應該已經爲one()函數去了。

來源

2015-06-28 17:04:22

事件處理程序不工作的動態附件

回答

相關問題