4

我正在尝试制作要执行某些操作并关闭弹出窗口的按钮（按钮在弹出窗口中，我正在使用jquery mobile）

<div class="ui-block-b">
      <a href="#popupDialog" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-transition="pop">Feedback</a>
</div>
<div data-role="popup" id="popupDialog"  data-theme="c">
      <div data-role="header" data-theme="a" class="ui-corner-top">
           <h1>Feedback</h1>
      </div>
      <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
       <h3 class="ui-title">Thank you for your participation!</h3>
       <p>Some content</p>
       <a href="#" data-role="button" data-inline="true" data-rel="back" data-transition="flow" data-theme="b">Cancel</a>
       <input type="button" id="feedback_send" value="Send"  data-inline="true" data-theme="b">
     </div>
</div>

当我单击按钮时，我想将数据发送到服务器并关闭弹出窗口（我使用将数据发送到服务器的函数连接发送，但我不知道之后如何关闭弹出窗口），我试图模拟取消点击但它没有关。

4

2 回答 2

7

弹出窗口可以像这样关闭：

$( ".selector" ).popup( "close" );

但在你的情况下，你应该像这样使用它：

setTimeout(function(){
    $( ".selector" ).popup( "close" );
},1);

需要 setTimeout 是因为 web-kit 浏览器无法立即关闭弹出窗口。

工作示例：http: //jsfiddle.net/Gajotres/B6TgZ/

$(document).on('pagebeforeshow', '#index', function(){ 
    $(document).on('click', '#feedback_send', function(){ 
        setTimeout(function(){
            $( "#popupDialog" ).popup( "close" );
        },1);
    });    
});

在关闭弹出窗口之前，请执行所有需要完成的操作。还有另一种方法，您可以随时关闭弹出窗口并触发popupafterclose以执行需要完成的操作。

$( "#popupDialog" ).on( "popupafterclose", function( event, ui ) {
    // Do something here, it requires SOlution 1 to trigger popup close
    alert('Popup closed');
});

当然，这个解决方案仍然需要按钮来触发弹出关闭功能。但与解决方案 1 不同，这不会在弹出窗口关闭之前造成轻微延迟（延迟 = 您在弹出窗口关闭之前将执行的操作）。

于 2013-06-07T14:19:18.597 回答
0

将 data-rel="back" 放在按钮中对我很有用，因为我正在使用另一个 on click 函数来捕捉点击。这样你就可以调用你的函数并关闭弹出窗口。

于 2014-10-30T19:58:20.487 回答