使用jquery將滑動事件添加到動態加載的內容中

Question

這是一個顯示問題的小提琴。

http://jsfiddle.net/4CLqY/4/

滑動在紅色框上工作正常，但在按下新按鈕后創建的新藍框上沒有。 （用鼠標滑過紅框以便更改）

對不起，如果這是一個騙局，但我沒有找到任何解決我的特定問題的解決方案。

代碼來自touchSwipe網站

JavaScript的

 $(function() {      
  //Enable swiping...
  $(".test").swipe( {
    //Generic swipe handler for all directions
    swipe:function(event, direction, distance, duration, fingerCount) {
      $(this).text("You swiped " + direction );  
    },
    //Default is 75px, set to 0 for demo so any distance triggers swipe
     threshold:0
  });
});

$(document).on('click','button',function(){


$('<div class="test" id="test2">Swipe me</div>').appendTo('body');

});     

HTML

<div class="test">Swipe me</div>

<button>New</button>

Answer 1

您可以將滑動事件重新附加到新元素，因為在添加初始事件時它們不存在。

試試這個小提琴 。

我添加了一個addSwipeTo選擇器的addSwipeTo函數，並將事件添加到它匹配的元素中。