Question

我有以下代码：

<div id="leaving-dialog" title="Confirmation Required">
    <p>You are now leaving the ****** section of ******</p>
</div>

jQuery(document).ready(function ($)
    {
        $("#leaving-dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 480,
            height: 240,
            resizable: false,
            draggable: false,
            zIndex: 9999999999
        });

        $(".leaving-section").click(function (event) {
            event.preventDefault();
            var targetUrl = $(this).attr("href");

            $("#leaving-dialog").dialog({
                buttons: {
                    "No, I want to stay here": function () {
                        $(this).dialog("close");
                    },
                    "Yes, that's okay": function () {
                        //window.location.href = targetUrl;
                        window.open(targetUrl);
                        $(this).dialog("close");
                    }
                }
            });
            $("#leaving-dialog").dialog("open");
        });
    });

我想要做的是将HTML移动到jQuery代码中，以便在DOM中创建纯粹的客户端。也许将它存储在变量中？

由于

Answer 1

$(function(){

    var dialog = '<div id="leaving-dialog" title="Confirmation Required"><p>You are now leaving the ****** section of ******</p></div>';

    $('body').append(dialog);

    $("#leaving-dialog").dialog({...});

});

Answer 2

删除

<div id="leaving-dialog" title="Confirmation Required">
    <p>You are now leaving the ****** section of ******</p>
</div>

并在函数调用中添加

jQuery(document).ready(function ($)
{
 $('body').append('<div id="leaving-dialog" title="Confirmation Required"><p>You are now  leaving the ****** section of ******</p></div>');
 [...]
});

Answer 3

你可以将原始html附加到这样的文档：

$('<div id="leaving-dialog" title="Confirmation Required">    <p>You are now leaving the ****** section of ******</p></div>').appendTo('body');

来源：http://api.jquery.com/jQuery/#jQuery2

jQuery UI：使用ONLY jquery创建对话框

3 个答案: