彈出框未顯示

Question

這是我的按鈕，我在我的jsp頁面中有它

  <button type="button" class="btn btn-primary" id="offerPhoneButton" onclick="offerPhone()">Offer Phone</button>

這是我的劇本

           <script type="text/javascript">
function offerPhone() {
    var phoneDialog = $("#myPhoneList").dialog({
        title: 'My Phone',
        autoOpen : false,
        closeText : 'hide',
        show : "fade",
        hide : "fade",
        modal : true,
        width : "400px",
        position: { my: "left top", at: "left top", of: window },
        open : function() {
            alert('hi');
            // load doctor_phones.jsp into the phones dialog.

             /* $(this).load('pages/doctor/write_prescription.jsp?patient_id=' + patientId + '&patient_name=' + patientName);  
               this doesn't work, seems to return before the content is actually loaded.    */

              var content =   ajaxGetJQuery("pages/doctor/doctor_phones.jsp"); 
               $("#myPhoneList").dialog("option", "title", "My Phones"); // this is necessary, b/c the title attribute doesn't work.
              $(this).html(content);                 
        }
    });

    $("#myPhoneList").dialog("open");
}
        </script>

但是，當我單擊要約電話按鈕時，如果您發現我的腳本有任何問題，則不會顯示彈出框，請讓我知道

Answer 1

您的代碼沒有問題。 如果您使用

onclick="offerPhone()

您的代碼必須在這樣的body標簽之間。

https://jsfiddle.net/u0L94rLe/

Answer 2

您的代碼運行正常，如下所示

小提琴

JS

function offerPhone() {
    var phoneDialog = $("#myPhoneList").dialog({
        title: 'My Phone',
        autoOpen : false,
        closeText : 'hide',
        show : "fade",
        hide : "fade",
        modal : true,
        width : "400px",
        position: { my: "left top", at: "left top", of: window },
        open : function() {
            alert('hi');
            var content =   ajaxGetJQuery("pages/doctor/doctor_phones.jsp"); 
               $("#myPhoneList").dialog("option", "title", "My Phones"); // this is necessary, b/c the title attribute doesn't work.
              $(this).html(content);                 
        }
    });




    $("#myPhoneList").dialog("open");
}

HTML

<button type="button" class="btn btn-primary" id="offerPhoneButton" onclick="offerPhone()">Offer Phone</button>

  <div id="myPhoneList" title="Basic dialog">
  <p>Heading</p>
</div>