顯示關閉按鈕在DIV沒有響應第一次點擊（或點擊）

我有一個問題，在第一次嘗試時顯示的DIV沒有關閉。用戶必須至少點擊一次，在頁面的任何位置 - 不必是關閉按鈕，然後才能點擊CLOSE實際關閉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上的關閉按鈕。同樣的情況發生在移動設備上，我必須在屏幕上某處顯示，然後才能再次點擊關閉。我能做些什麼呢？

來源

2014-09-18 Peter Mercury

只有「關閉」按鈕在第一次點擊時沒有工作，或確認框中的任何元素？ – 2014-09-18 19:03:06

這是一個很好的問題。只有在第一次點擊之後，才能操作頁面上的其他元素。 – 2014-09-18 19:06:23

這意味着在其他人面前有一個透明元素，點擊時消失。如果你發現了什麼，你可以在你的ajax函數後通過Js刪除它。 – 2014-09-18 19:10:12

$("#popupBasic").hide(); 
$("#popupBasic-screen").hide();

在ajax調用之前添加了上述內容。

我認爲這不會是一個問題，如果有一個適當的解決方案.popup（「關閉」）是未定義的。

來源

2014-09-18 21:06:28

看到我的答案。 $（「＃popupBasic」）。popup（「close」）;是關閉一個彈出窗口小部件的正確方法。 API DOC：http://api.jquerymobile.com/popup/#method-close – ezanker 2014-09-19 13:59:37

不幸的是，即使使用最新的jQuery，我的客戶的網頁上的函數仍未定義。我認爲這個問題與初始化有關。 – 2014-09-19 14:28:13

彈出標記在哪裏？它應該位於data-role =「page」DIV內，與標題，內容和頁腳處於同一級別。 – ezanker 2014-09-19 16:05:28

問題是你沒有使用彈出窗口小部件的close method，你只是隱藏div並離開模態屏幕。

變化;

$("#popupBasic").hide();

要：

$("#popupBasic").popup("close");

工作DEMO

順便說一句，如果你想要去的鏈接彈出窗口，看看這個博客條目我寫道： http://jqmtricks.wordpress.com/2014/05/16/chained-popups-with-simpledialog2/

來源

2014-09-18 20:45:29 ezanker

顯示關閉按鈕在DIV沒有響應第一次點擊（或點擊）

回答

相關問題