0

在我的 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但pagehide 永远不会触发，因此对话框不会关闭。

任何解决此问题的帮助将不胜感激。

4

1 回答 1

2

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

演示 1 /演示 2

静态弹出窗口

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

动态生成的弹出窗口

$(document).on('popupafterclose', '#popupID', function () {
  $('#dialogID').dialog('close');
});
于 2013-06-28T16:43:11.760 回答