Jquery 显示div内容的sharepoint模式弹出窗口

Jquery 显示div内容的sharepoint模式弹出窗口,jquery,html,sharepoint,Jquery,Html,Sharepoint,我试图在sharepoint模式弹出窗口中显示div内容。下面是我的代码: function callPopup(){ var options = SP.UI.$create_DialogOptions(); options.html = addFilePopup //id of the div to be displayed options.title = 'Add file'; options.width = 300; options.height = 150

我试图在sharepoint模式弹出窗口中显示div内容。下面是我的代码:

function callPopup(){
var options = SP.UI.$create_DialogOptions();
    options.html = addFilePopup //id of the div to be displayed
    options.title = 'Add file';
    options.width = 300;
    options.height = 150;
    SP.UI.ModalDialog.showModalDialog(options);
}
HTML:

弹出窗口第一次显示自己很好。 但是,如果第二次调用callPopup函数,则表示addFilePopup未定义。 第一次调用弹出窗口后,似乎从DOM中删除了div addFilePopup。知道我做错了什么吗


附言:我曾经尝试过使用和不使用runat=server作为div。我是sharepoint新手,但我以前也遇到过这种情况。发生的情况是,您使用的是原始div,并且在第一次调用后它确实会被删除。如果仍然存在此问题,可以使用jQuery克隆函数

所以不是 options.html=addFilePopUp

我建议先为你的div设置一个变量

var popUpDiv = $("div#addFilePopUp").clone();
然后打电话给你的选择

var options = SP.UI.$create_DialogOptions();
options.html = popUpDiv;
options.title = 'Add file';
options.width = 300;
options.height = 150;
SP.UI.ModalDialog.showModalDialog(options);

这将创建多个div实例,因此必须使用css隐藏原始div。希望这有帮助

通常当你克隆时,这应该是你最后的选择,因为它会给你带来很多副作用,比如双倍的ID

我假设callPopup是一个事件回调。假设你点击一个按钮会打开这个弹出窗口,这个弹出窗口会显示已经加载到DOM中的html代码

   $('#addFilePopup').hide();

   function callPopup(){
      var options = SP.UI.$create_DialogOptions();
      options.html = addFilePopup //id of the div to be displayed
      options.title = 'Add file';
      options.width = 300;
      options.height = 150;
      SP.UI.ModalDialog.showModalDialog(options);
   }
这将使html保持隐藏状态,同时将其加载到DOM中。 触发事件时,应添加

 $('#addFilePopup').show();
您的代码应该如下所示:

$('#addFilePopup').hide();
function callPopup(){
$('#addFilePopup').show();
  var options = SP.UI.$create_DialogOptions();
  options.html = addFilePopup //id of the div to be displayed
  options.title = 'Add file';
  options.width = 300;
  options.height = 150;
  SP.UI.ModalDialog.showModalDialog(options);
}

由于options.html必须接收DOM元素,与msdn文档所述相反,这是我所知道的最简单的方法。我不能说它是否理想,但根据应用程序的复杂性,它可能会提示Sharepoint弹出窗口中的有效选项

另外,我知道这是6年后的事了,但如果有人遇到这个问题,希望能提供更好的解决方案

$('#addFilePopup').hide();
function callPopup(){
$('#addFilePopup').show();
  var options = SP.UI.$create_DialogOptions();
  options.html = addFilePopup //id of the div to be displayed
  options.title = 'Add file';
  options.width = 300;
  options.height = 150;
  SP.UI.ModalDialog.showModalDialog(options);