如何使用 html 生成动态弹出窗口？答案

【问题标题】：How can I generate dynamic popup with html ?如何使用 html 生成动态弹出窗口？
【发布时间】：2017-03-02 00:32:20
【问题描述】：

我有一个 jquery 弹出窗口：

   <div id="dialog-modal" title="Test">
    <p>Test</p>      
</div>

   $("#dialog-modal").dialog({
        autoOpen: false,
        width: 300,
        height: 250,
        show: {
            effect: "blind",
            duration: 1000
        },
        hide: {
            effect: "explode",
            duration: 1000
        }
    });

    $("#modal-opener").click(function () {       
        $("#dialog-modal").dialog("open");

    });

我有一个来自 db 的 html 代码。示例：

ViewBag.Test = "<table><tr><td>Test</td></tr><tr><td>Test 123</td></tr>";

所以，我希望这个 html 进入弹出窗口

我该怎么办？

谢谢。

【问题讨论】：

只需将<p>Test</p> 替换为@Html.Raw(ViewBag.Test)
我试过了，但是其他html元素没有加载
还有哪些元素？您的所有问题都表明您想要呈现 ViewBag.Test 的值
是的，但是，我只想在单击时将ViewBag.Test 的值渲染到弹出窗口中
为什么 - 它最初是隐藏的！

标签： jquery html asp.net asp.net-mvc asp.net-mvc-4

【解决方案1】：

打开前需要使用.html()。

$("#modal-opener").click(function () {       
     $("#dialog-modal").html("<b>New HTML</b>");                               
     $("#dialog-modal").dialog("open");
});

【讨论】：

@FerhatArslan ：没问题，很高兴为您提供帮助

【解决方案2】：

试试这样的：

$("#dialog-modal").html('<table><tr><td>Test</td></tr><tr><td>Test 123</td></tr>');
// It will append the passed html to the popup div

$("#dialog-modal").dialog({
    // this will open the popup with the appended html
});

【讨论】：