Question

我的JS文件中有以下函数，它定义了here中定义的模态对话框的HTML代码

我已经复制了HTML代码并将其分配到我的JS函数的变量中：

function loadModalDialog(p1) {

     var modal =     '<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">' +
                    '   <div class="modal-header">' +
                    '       <button type="button" class="close" data- dismiss="modal" aria- hidden="true" >×</button>' +
                    '       <h3 id= "myModalLabel"> Modal header </h3>' +
                    '   </div>' +
                    '   <div class="modal-body">' +
                    '       <p>One fine body…</p>' +
                    '   </div>' +
                    '   <div class="modal-footer">' +
                    '       <button class="btn" data- dismiss="modal" aria- hidden="true"> Close </button>' +
                    '       <button class="btn btn-primary"> Save changes </button>' +
                    '   </div>' +
                    '</div>';  


}

另外，我有另一个调用loadModalDialog的JS函数，但是此时我不知道如果我在上面的函数内部，我将modal var上的html注入到DOM中，这样我就可以显示模态对话框了

顺便说一句，我想通过JS函数注入html，因为最终我将更改对话框的主体，它将根据p1值动态更改。

BTW，调用loadModalDialog的代码行如下所示：

<a href="" role="button" onClick=loadModalDialog("' + p1 + '") data-toggle="modal">PopUp</a>

知道它应该如何运作吗？

Answer 1

可能是一种方法。诀窍是建立一个适当的选择器，可以调用dialog（）函数：

$("<div>Sample of an injected dialog</div>").dialog();

如果你以相反的方式观看jquery样本，实际上是非常容易的

$( "#dialog" ).dialog();

您只需将选择器替换为具体文本（无元字符）。

如果要在加载对话框后立即执行js函数，则可以内联该函数并通过JSON字符串化提供它的参数。喜欢这个

$("<div id='difflv2d'></div><script>drawGraph("
  + JSON.stringify(sd.side) + "," + JSON.stringify(sd.id) + ","
  + JSON.stringify(sd.title) + "," + JSON.stringify(sd.num) + ","
  + JSON.stringify(sd.data) + ")</script>").dialog();

在上面的示例中，绘图函数选择由id'difflv2d'给出的div并将其内容放在其上。由于div已经是对话框的一部分（刚刚加载），因此图形将出现在该对话框中。从正确提供的变量中读出要绘制的东西。

以下是参考：on the fly div

通过使用JQuery

1 个答案: