Question

在我的jQM - Backbone应用程序中，如果某个条件为真，我会以编程方式添加一个对话框，如下所示

$('body').append('<div data-role="dialog" id="interlink" data-theme="b" data-close-btn="none" data-url="insignificant"></div> ');
// remove dialog from DOM on pagehide
$("#interlink").on('pagehide', function () {
    $(this).remove();
    // remove this views popup-containers 
    $('#interlink-video-popup-popup').remove();
});

除了对话框中的其他内容外，还有一个用于打开弹出窗口小部件以播放视频剪辑的按钮和用于关闭对话框的关闭按钮。关闭对话框的代码如下所示：

backBtnHandler: function(e) {
    e.preventDefault();
    $('#interlink').dialog('close');
    $(this).remove(); // all DOM listeners get removed as well by jQuery
}

如果以全长方式观看视频片段，弹出窗口小部件结束并且用户单击对话框关闭按钮以关闭它，则此操作非常有效。要求是视频剪辑正在播放并且用户扫描另一个NFC标签时视频应该停止，触发结束事件并关闭弹出窗口。这也有效，但对话框也应关闭。这是一个简化的代码片段，其中包含模拟NFC扫描的超时时间：

INTERPRETOUR.interlinkVideoPlayer = $('#interlink-video-player')[0];
// bind onended event to close the popup   
$(INTERPRETOUR.interlinkVideoPlayer).on('ended', function() {
    $('#interlink-video-popup').popup('close');
    INTERPRETOUR.interlinkVideoPlayer = 'undefined';
    $('#interlink-back-btn').trigger('click');
});
// play video
INTERPRETOUR.interlinkVideoPlayer.src = 'http://mydomain.ca' + this.model.get('video')[0].url; 
INTERPRETOUR.interlinkVideoPlayer.play();
setTimeout(function() {
    $.publish('item', '2479');
}, 5000);

问题是$('#interlink-back-btn').trigger('click');调用backBtnHandler，但pagehid e永远不会被触发，因此对话框不会关闭。

非常感谢您解决此问题的任何帮助。

Answer 1

不是使用.trigger('click')调用按钮，而是在popupafterclose事件触发时绑定结束。

Demo 1 / Demo 2

静态弹出窗口

$('#popupID').on('popupafterclose', function () {
  $('#dialogID').dialog('close');
});

动态生成弹出

$(document).on('popupafterclose', '#popupID', function () {
  $('#dialogID').dialog('close');
});

动态关闭对话框

1 个答案: