【问题标题】:JQuery mobile: Tap event on listview item also fires hidden object eventJQuery mobile:listview项目上的点击事件也会触发隐藏对象事件
【发布时间】:2011-09-27 15:25:41
【问题描述】:

我在动态生成的列表视图上遇到了点击事件的问题。当我选择列表中的第一项时,会触发动作,其中一个是取消隐藏附近的对象。问题是未隐藏对象的点击事件也在那个时候触发。我没有广泛的编程背景,但我从事软件测试,因此您可以期待彻底的复制步骤。 :)

这是在选择任何列表项时触发的事件:

//When a list item is selected
    $('#showItems').delegate('li', 'tap', function () {
        if ($('#showItems').hasClass("courses")){
            courseNum = $(this).find('.course').text();
            var profArr=new Array();
            profArr[0]="";
            profArr[1]="";
            ajax_get_textbooks(courseNum, profArr[1], profArr[0]);
            $('#showItems').removeClass('profs courses booksProf eitems').addClass('books');
        }
        else if ($('#showItems').hasClass("profs")){
            prof = $(this).text();
            profArr = prof.split(", ");
            ajax_get_textbooks(courseNum, profArr[1], profArr[0]);
            $('#showItems').removeClass('profs courses books eitems').addClass('booksProf');
        }
        $('#filters').removeClass('hidden'); // this is the object that gets acted upon incorrectly
    });

And this is the event that also gets fired when the first list element is selected:

//When filter by professor/e-resources is selected
 $('.filterBtn').bind('tap',function(event){
    var filter = $(this).text();
    filter = filter.toLowerCase();
    if (filter.indexOf("prof") !== -1 ) {
        ajax_filter_professor(courseNum);
        $('#showItems').removeClass('books courses booksProf eitems').addClass('profs');
    }
    else {
        ajax_filter_eresources(courseNum);  
        $('#showItems').removeClass('books profs booksProf courses').addClass('eitems');
    }
    $('#showItems').listview('refresh');
});

我想我可以通过将 taphold 事件附加到同一个函数来解决这个问题,但是下面的行不起作用:

$('#showItems').delegate('li', 'tap taphold', function () {

仅当我将相同的代码复制到新的事件触发器中以进行点击时,它才有效。

我希望能够以某种方式禁用 $('.filterBtn').bind 直到第一个列表完成刷新,但不知道如何做到这一点。

这里是复制步骤

  1. http://library.iit.edu/mbad/#textbooks 在文本框中输入“hu”。课程列表传播。
  2. 选择第一个列表项 (HUM102)。
  3. 请注意,您的鼠标现在悬停在两个按钮之一上:“by Prof”或“E-items”。如果您在手机上对此进行测试,其中一个按钮事件也会触发。

谁能帮我弄清楚我做错了什么?

【问题讨论】:

  • 解决了一个长周末并找到了 e.stopPropagation() 对象。

标签: jquery events listview mobile hidden


【解决方案1】:

也许您可以尝试使用 JQM 的 vclick 事件。 在http://jquerymobile.com/test/docs/api/events.html 上查看 JQM 支持的事件列表 如果不是 Vclick,其他东西可能适合。

【讨论】:

    猜你喜欢
    • 2018-12-24
    • 2011-06-11
    • 1970-01-01
    • 2014-06-09
    • 1970-01-01
    • 2012-01-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多