我有一个问题,在第一次尝试时,显示的DIV没有关闭。用户必须至少在页面上的任何位置单击一次 - 不必是关闭按钮,然后才能单击“关闭”以实际关闭DIV。首先,在DIV之前有一个短暂的领先。
我在页面中使用jquery移动弹出窗口包含单个文本字段和提交按钮。它看起来像这样(减去布局)。用户通过此弹出窗口提交他们的注释。
<div data-role="popup" id="popupBasic" data-corners="false">
<textarea rows="9" name="note" id="AttitionalNoteText"></textarea>
<a href="#" data-mini="true" id="submitnote" data-role="button">Submit</a>
<a href="#" data-rel="back" id="cancelSubmitNote" data-mini="true" data-role="button">Cancel</a>
</div>
当用户点击提交时,我执行ajax响应以将文本发送到服务器,并且在成功时通过向用户显示隐藏的DIV作为确认来跟进它。我使用DIV而不是另一个弹出窗口,因为我意识到在我的ajax调用中不可能链接弹出窗口。
// this is called when the user hits submit in the popup
$("#submitnote").click(function (e) {
e.preventDefault();
// do stuff here to pass textstring
$("#popupBasic").hide();
$.ajax({
type: 'POST',
data: textstring,
url: '/something/addnote',
success: function (data) {
showConfirm(data); // upon success call the function below to open the DIV
}
});
$("#AttitionalNoteText").val("");
});
function showConfirm(data) {
document.getElementById("confirmMsg").innerHTML = data;
$("#confirmBox").show();
}
// this is to close that DIV
$("#closeConfirmBox").click(function (e) {
$("#confirmBox").hide();
});
这是简单的DIV以及关闭按钮。
<div id="confirmBox">
<div id="confirmMsg" style="padding: 10px; font-size: 16px;">
this message gets replaced with whatever ajax call returned
</div>
<a href="#" id="closeConfirmBox" data-role="button">Close</a>
</div>
似乎在弹出窗口隐藏并且我的DIV出现后,鼠标不会显示为手指指针,直到我点击页面上的某个位置。只有这样才能正确使用DIV上的关闭按钮。在移动设备上也会发生同样的情况,我必须在屏幕上的某个地方标记,然后才能再次点击关闭。我该怎么办?
答案 0 :(得分:0)
问题是你没有使用弹出窗口小部件的 close method ,你只是隐藏div并将模态屏幕留在原位。
更改;
$("#popupBasic").hide();
要:
$("#popupBasic").popup( "close" );
顺便说一句,如果您确实想要使用链式弹出窗口,请查看我写的这篇博文:http://jqmtricks.wordpress.com/2014/05/16/chained-popups-with-simpledialog2/正在使用 DEMO
答案 1 :(得分:0)
$("#popupBasic").hide();
$("#popupBasic-screen").hide();
在ajax调用之前添加了上述内容。
我认为如果找到.popup(&#34; close&#34;)未正确定义的正确解决方案,这不会成为一个问题。