jquery - 如何检测 jQuery mobile 何时打开或关闭选择菜单？

Question

我正在使用带有 jQ​​uerymobile 的 phonegap，

使用自定义菜单时，我知道很容易检查具有“ui-selectmenu-screen”类的div是否也有“ui-screen-hidden”类，但我的问题是我无法触发此功能，我完全不知道“点击”事件在哪里触发，当我点击折叠的选择菜单时，我尝试过：

$('a.ui-btn').bind('click',function() {
    if (  $('.ui-selectmenu-screen').hasClass("ui-screen-hidden");  ) {
       DO WHAT EVER...
    }
});

以及许多变化，但就像没有点击事件......

Answer 1

我今天刚遇到这个问题并开发了以下解决方案。

$("select").change(function() {

    // Ignore events if the interval has already been established
    if (this.interval)
        return false;

    // Self invoking anonymous function to prevent polution of parent scope 
    // in some environments (IE), passes 'this' as element
    (function (element) {

        // Set an interval to watch for the window to close
        element.interval = setInterval((function callback() {

            // Find the widget
            var $widget = $('#'+element.id+'-menu').closest('.ui-selectmenu');

            // If it has been closed DO STUFF and clear the interval
            if ($widget.hasClass('ui-selectmenu-hidden')) {

                // YOUR CODE HERE

                clearInterval(element.interval);

            }

            return callback;
        })(), 1000);

    })(this);

    return false;
});   

另外值得注意的是，如果您通过 ajax 重新加载这些表单元素，则需要在插入新 HTML 之前从 DOM 中删除自定义小部件元素。动态更新选项将是一个更优雅的解决方案，但我没有那个选项。

$('.ui-selectmenu, .ui-selectmenu-screen, .ui-dialog').remove();