0

我正在寻找使用 jQuery 将 javascript 文件加载到 iframe 中，但似乎我正在这样做，检查它们所在的 DOM，但它们的行为就像它们在父级中一样。这是一些代码：

somejsfile.js：

function createDraggable(draggableId){
    if (jQuery.isFunction(jQuery.fn.draggable)) {
        jQuery('#'+draggableId,fPage).draggable({
            containment: '#contentArea',
            iframeFix: true,
            start: function() {
                dragStart();
            },
            drag: function() {
                dragHappening(draggableId);
            },
            stop: function() {
                dragEnd(draggableId);
            }
        });
    } else {
        setTimeout(function(){createDraggable(draggableId)},100);
    }
}
var fPage = $("#contentFrame").contents();
createDraggable(someElementId);

父.js：

function loadJS(filepath,w) {
    if (!$("script[src*='"+filepath+"']",w).length) {   
        $("head",w).append('<script type="text/javascript" src="'+filepath+'"></script>');
    }
}
var fPage = $("#contentFrame").contents();
loadJS('jquery.min.js',fPage);
loadJS('jquery.ui.min.js',fPage);
loadJS('jquery.ui.draggable.min.js',fPage);
loadJS('somejsfile.js',fPage);

现在在 somejsfile.js 中，jQuery('#'+draggableId,fPage).draggable({可以工作，但jQuery('#'+draggableId).draggable({不能，这让我相信它并没有真正加载到 iframe 中。当我查看 firebug 时，我在 iframe 的头部看到了那些脚本，但我在主窗口 jQ​​uery 中看到了可拖动功能，我没有在那里加载它。

我不希望它出现在主窗口中的原因是它无法正常工作，因为它在选择时会从对象上跳开，并且在单击时会保持选中状态以拖动，直到您再次单击为止。

4

2 回答 2

0

这个问题似乎是我要问的。我将 loadJS 函数更改为：

function loadJS(filepath,w) {
   var script = page.document.createElement("script");
   script.type = "text/javascript";
   script.src = filepath;
   page.document.head.appendChild(script);
}

传入的 w 变量应该是这种格式：

frames['contentFrame'].contentWindow
于 2013-07-18T20:00:51.373 回答
0

这有效：

$("#contentFrame").load(function(){
  function loadJS(filepath, iframe) {
    console.log('loading: ', filepath);
    var script = iframe.get(0).contentWindow.document.createElement("script");
        script.type = "text/javascript";
        script.src = filepath;
    iframe.get(0).contentWindow.document.head.appendChild(script);
  }
  var fPage = $("#contentFrame");  
  loadJS('jquery.min.js', fPage);
  loadJS('jquery-ui.min.js', fPage);
  loadJS('jquery.ui.draggable.min.js', fPage);
  loadJS('somejsfile.js', fPage);  
});

另请看一下：为什么将 <script> 附加到动态创建的 <iframe> 似乎会在父页面中运行脚本？

于 2013-07-18T20:27:04.123 回答