javascript - 使用jQuery将滑动事件添加到动态加载的内容

这是一个显示问题的js小提琴。

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>

最佳答案

您可以将swipe事件重新附加到新元素，因为添加初始事件时它们不存在。

尝试this fiddle。

我添加了一个带有选择器的addSwipeTo函数，并将事件添加到它匹配的元素中。