javascript - 同一页面中的多次交换不起作用

Question

我有左滑动的 div

  $(".iframe-content").swipeleft(function(e) {

        alert ("test 1");
    });

    <div class="iframe-content">
<div class="noswipe">no swipe</div>
<div class="noswipe">no swipe</div>
<div class="noswipe">no swipe</div>
<div class="noswipe">no swipe</div>
    <div id="another-swipe">swipe here</div>
<div class="noswipe">no swipe</div>
<div class="noswipe">no swipe</div><div class="noswipe">no swipe</div>
    </div>

现在我的问题是：

在iframe-content上滑动工作正常，但我再次滑动another-swipe

$(".another-swipe").swipeleft(function(e) {


        alert("test2")

    });

但它没有发出先前的警报alert("test2");......

Answer 1

1. 使用 class 而不是 ID 与另一个滑动。

2. 你可以使用 e.stopPropagation(); 停止上层调用

在这里看小提琴（点击而不是滑动）：http: //jsfiddle.net/26w2q/

HTML

<div class="iframe-content">
    <div class="noswipe">no swipe</div>
    <div class="noswipe">no swipe</div>
    <div class="noswipe">no swipe</div>
    <div class="noswipe">no swipe</div>
    <div class="another-swipe">swipe here</div> <<< USE class instead of id
    <div class="noswipe">no swipe</div>
    <div class="noswipe">no swipe</div>
    <div class="noswipe">no swipe</div>
</div>

查询

$(".another-swipe").swipeleft(function(e) {
e.stopPropagation();
alert("test2")
});
$(".iframe-content").swipeleft(function(e) {
    alert ("test 1");
});