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

单击#Show时可以使用ajax。

的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");
            }
        });
});

对话框不会出现

1 个答案: