Question

我在Backbone中有以下模板，所有模板都完美呈现。

    <a href="#list" data-role="button" id="button" class="all-unselected"></a>
    <a href="#" data-role="button" id="button" class="suggested-unselected"></a>
    <a href="#" data-role="button" id="button" class="friends-unselected"></a>
    <a href="#" data-role="button" id="button" class="private-unselected"></a>
    <a href="#" data-role="button" id="button" class="buzz-unselected"></a>
    <script type="text/javascript">
        var buttons = $("a#button");

        for(var i=0; i<buttons.length; i++){
            $(buttons[i]).bind('touchstart', select, false);
            $(buttons[i]).bind('touchend', unselect, false);
        }

        function select(){
            alert('test');
        }
        function unselect(){
            alert('unselect');
        }
    </script>

如果我写下以下内容，触摸开始不会被触发：

    <a href="#" data-role="button" id="button1" class="suggested-unselected"></a>
    <script type="text/javascript">
            document.getElementById('button1').addEventListener('touchstart', select, false);

        function select(){
            alert('test');
        }
        function unselect(){
            alert('unselect');
        }
    </script>

它有效。好像jQuery无法绑定事件。可能是什么问题？

Answer 1

您的代码中存在一些问题。

首先：

var buttons = $("a#button");

这将选择标识为button的锚元素。由于ID应该是唯一的，这应该只返回一个元素。但是，您正在尝试循环返回的值。这不应该像你想要的那样工作。

第二

如果您选择了一组jQuery对象，则通常使用.each()来迭代它们。然而，如果您尝试将事件处理程序绑定到一组对象，您甚至不必在循环中执行此操作，因为jQuery能够将事件绑定到选择。

第三

.bind() - 效果不同，您正在混合.bind() - 语法与addEventListener语法。

所以，要将你的工作非jQuery示例（不是不使用jQuery btw）转换为jQuery，这将看起来像：

$('#button1').bind('touchstart', select);
$('#button1').bind('touchend', unselect);

function select(){
alert('test');
}

function unselect(){
alert('unselect');
}

在jQuery中绑定'touchstart'事件不能使用android phonegap和backbone

1 个答案: