Jquery 点击显示的按钮会在后台触发隐藏按钮事件

我在同一位置有两个按钮（一个在另一个上，绝对位置）。我正在使用jquerymobile1.4和phonegap3.3

按钮#1最初是可见的

按钮#2最初是

隐藏的

当我点击按钮1时，它应该隐藏按钮1并显示按钮2

但奇怪的是，当点击按钮1时，它也会触发按钮2，就像它已经被显示一样。使用下面的代码，点击按钮#1，隐藏按钮#1，显示按钮#2，隐藏按钮#2和显示按钮#1…回到我们开始的地方

我做错什么了吗

HTML:

---

我过去也遇到过这种情况，在移动设备上，

vclick

处理程序启动了两次。您可以通过在

vclick

处理程序的末尾添加

return false

来修复此问题

$('#miniWeightLevel').unbind('vclick').bind('vclick', function (e) {        
    e.stopPropagation();
    $('#miniWeightLevel').hide();
    $('#minifyCross').show();

    return false;
});
$('#minifyCross').unbind('vclick').bind('vclick', function (e) {       
    e.stopPropagation();
    $('#miniWeightLevel').show();
    $('#minifyCross').hide();

    return false;
});

看看这些小提琴。第一个是你的原始代码。在Chrome桌面上运行时一切正常。但是，在iPhone上运行时，我可以看到两个事件都会触发——当我单击“x”时，另一个按钮会立即显示，但随后会触发它的单击，将其隐藏并再次显示“x”

第二个提琴显示更新后的代码，在处理程序的末尾显示

return false

$('#miniWeightLevel').unbind('vclick').bind('vclick', function (e) {        
    e.stopPropagation();
    $('#miniWeightLevel').hide();
    $('#minifyCross').show();

    return false;
});
$('#minifyCross').unbind('vclick').bind('vclick', function (e) {       
    e.stopPropagation();
    $('#miniWeightLevel').show();
    $('#minifyCross').hide();

    return false;
});

---

好的，我找到了解决办法

不要使用

e.stopPropagation（）

只需使用：

e.preventDefault（）

不知道为什么，但这解决了我的问题。
e.preventDefault（）之所以有效，是因为StopRopagation用于确保事件不会在链上冒泡。点击标签也会触发其父标签上的点击事件，然后触发其父标签上的点击事件，等等。stopPropagation可以防止这种情况发生

preventDefault用于停止元素的正常操作，例如，链接上的单击处理程序中的preventDefault将停止后续链接，或者提交按钮上的preventDefault将停止提交表单。
按钮html/css是什么？我的意思是你最初是如何隐藏一个按钮的。@AtanuCSE我只是编辑了这个问题，对不起。我只是把一个藏起来，把另一个展示出来。Html是基本的。将
：可见的
添加到按钮，例如
$（“\btnID:visible”）。打开（
@Omar，谢谢，但我对
$（''miniWeightLevel:visible'）有同样的问题。关闭（'vclick'）。打开（'vclick'.
和
$（'minifyCross:visible'）。关闭（'vclick'）。打开（'vclick'.
）如何使用属性“disabled”结合你的显示/隐藏逻辑？@down投票人：我真的不明白你为什么否决我的答案。我找到了一个对我有效的解决方案，我在这里提出了。它有什么问题？
$('#miniWeightLevel').unbind('vclick').bind('vclick', function (e) {        
    e.stopPropagation();
    $('#miniWeightLevel').hide();
    $('#minifyCross').show();

    return false;
});
$('#minifyCross').unbind('vclick').bind('vclick', function (e) {       
    e.stopPropagation();
    $('#miniWeightLevel').show();
    $('#minifyCross').hide();

    return false;
});