jQuery Mobile的V单击事件仅触发一次

我试图做一个简单的按钮翻转，改变它的图标时，它的vclicked，但真的不明白为什么V单击事件只发射一次，有人可以提供一些线索这光？如果我使用“单击”或将事件直接附加到按钮元素，我会得到相同的结果。jQuery Mobile的V单击事件仅触发一次

的jsfiddle在：提前http://jsfiddle.net/w7quoyn4/

$('#btnAddToCart').on('vclick', function() { 

    console.log("btnAddToCart vclick event fired"); 

    if ($(this).attr('data-icon', "plus")) { 
     $(this).attr('data-icon', "minus").button().button("refresh"); 
    } else { 
     $(this).attr('data-icon', "plus").button().button("refresh"); 
    } 

});

谢谢:)

来源

2014-10-07 derelict

'如果（$（本）.attr（ '数据图标'， “加”））'没有做什么，你认为它。 – 2014-10-07 11:27:09

谢谢！我会尽快赶到事件发生:) – derelict 2014-10-07 11:39:07

事件确实发生。不幸的是，我上面引用的条件语句总是返回“true”，所以在下一个事件中不会发生可见的变化。 – 2014-10-07 11:40:23

有在代码中的两个问题。

首先，条件表达式$(this).attr('data-icon', "plus")调用设置器形式attr()，它将始终返回其被调用的jQuery对象。由于对象在布尔上下文中始终为true，因此您的else分支将永远不会被采用。

为了解决这个问题，你可以调用的attr()吸气形式和结果比较：

if ($(this).attr("data-icon") == "plus") { 
    // ... 
}

话又说回来，到button()的调用是问题的心脏。使用适当的方法是buttonMarkup()，但自1.4版以来已弃用（并将在1.5版中删除）。

实际的解决方案是增加和删除相应类别自己，如：

$(document).on("vclick", "#btnAddToCart", function() { 
    console.log("btnAddToCart vclick event fired"); 
    $(this).toggleClass("ui-icon-plus ui-icon-minus"); 
});

你可以看到在this updated fiddle结果。

来源

2014-10-07 11:59:59

好的，你打我完成答案。只建议'$ this.closest（ '[数据-ID]'）。ATTR（ “数据ID”）'作为一个更便携的替代:) – 2014-10-07 12:04:04

@TrueBlueAussie，我在第一次同样的想法，但如果' ＃btnAddToCart'元素还暴露了一个'data-id'属性，那么'最接近（）'将会匹配它而不是它的祖父母，并且会发生混乱。 '父母（）。方程（1）'是比'父短，但效率较低（）。父（）'，所以我选择离开的那部分代码，因为它是:) – 2014-10-07 12:07:41

如何'$ this.parent（）.closest（ '[数据-ID]'）。ATTR（ “数据ID”）'？每当我看到分层依赖我开始担心:) – 2014-10-07 12:11:16

jQuery Mobile的V单击事件仅触发一次

回答

相关问题