對話框不出現

Question

我在寫表單並完成表單部分，但是，我需要顯示一個彈出對話框來演示一些文本。我試圖用ajax和.load導入txt文件，但我認爲隱藏代碼會更容易使用。附加是我想要彈出的div，文本在p標籤內。

<div class="container" id="dialog" style="display:none"> 
     <p></p> 
    </div> 

<div class = "container"> 
    <div class="form-group row"> 
     <section class="col-xs-2"> 
      <div class="form-check"> 
       <input class="form-check-input disabled" type="checkbox" style="margin-right:10px"> 
       <label class="form-check-label">I Agree to Terms 
       </label> 
      </div> 
     </section> 
     <section class="col-xs-10" style="margin-left:-25px"> 
      <button class = "btn" style="background:transparent;border:none!important" id="Show">Show Me!</button>      
     </section> 
    </div> 
</div> 

這是jQuery的

$(document).ready(function(){ 

var dialog = $("#dialog"); 

dialog.dialog({ 
    title: "Dialog", 
    modal: true, 
    draggable: false, 
    resizable: false, 
    autoOpen: false, 
    width: 500, 
    height: 400 
}); 

$('#Show').click(function() { 
    dialog.show(); 
    dialog.dialog("open"); 
}); 

$(document).on('click', ".ui-widget-overlay", function() { 
    dialog.dialog("close"); 
}); 
}); 

Answer 1

您可以使用Ajax要做的就是點擊#Show時。

的test.txt

You must agree this fact 
1. 
2. 
3. 

使用Ajax成功功能

$('#Show').click(function() { 
    $.ajax({ 
      url: "test.txt",    
      success: function (data){ 
       dialog.find("p").html(data); 
       dialog.show(); 
       dialog.dialog("open"); 
      } 
     }); 
});