我正在为我的网站的实时编辑。 我有CSS和HTML零件下来,唯一的问题是现在的JS部分。 这里是代码的一个片段
var frame = $('#preview_content'),
contents = frame.contents(),
body = contents.find('body');
csstag = contents.find('head').append('<style></style>').children('style');
java = contents.find('head').append('<script><\/script>').children('script');//Issues here
$('.area_content_box').focus(function() {
var $this = $(this);
var check = $this.attr('id');
$this.keyup(function() {
if (check === "html_process"){
body.html($this.val());
} else if(check === "css_process") {
csstag.text($this.val());
} else if (check === "java_process"){
java.text( $this.val() );
}
});
});
问题是,它是不是在注射I帧体,也不是头脚本标记过我试试这个时候。 我对注入含有结束脚本标签的一些问题阅读起来。 我需要弄清楚如何注入脚本标记,真的希望他们的头部,但如果它在体内是罚款更容易。
jfriend00 - 我将重点放在使这个香草,如果你认为我应该诚实。
因此,建议对任何话如何去让我的编辑正常工作与注射JS?
的这两行代码看起来他们可能有问题:
csstag = contents.find('head').append('<style></style>').children('style');
java = contents.find('head').append('<script><\/script>').children('script');//Issues here
现在看来似乎会更好打造风格标签,并记住,DOM元素。
var iframe = document.getElementById("preview_content");
var iframewindow = iframe.contentWindow || iframe.contentDocument.defaultView;
var doc = iframewindow.document;
var csstag = doc.createElement("style");
var scripttag = doc.createElement("script");
var head = doc.getElementsByTagName("head")[0];
head.appendChild.cssTag;
head.appendChild.scriptTag;
$('.area_content_box').focus(function() {
var $this = $(this);
var check = this.id;
$this.keyup(function() {
if (check === "html_process") {\
// I would expect this to work
doc.body.html($this.val());
} else if(check === "css_process") {
// I don't know if you can just replace CSS text like this
// or if you have to physically remove the previous style tag
// and then insert a new one
csstag.text($this.val());
} else if (check === "java_process"){
// this is unlikely to work
// you probably have to create and insert a new script tag each time
java.text( $this.val() );
}
});
});
这应该适用于身体HTML,它可以为CSS文本样式标记工作。
我不相信它会为JavaScript的工作,你无法通过分配文本标记你的方式更改脚本。 一旦脚本已经被解析,这是在JavaScript的命名空间。
没有公共API我除去先前定义和解释脚本知道的。 你可以重新定义全局符号与随后的脚本,但不删除以前的脚本或它们的影响。
如果这是我的代码,我会删除以前的风格标签,创建一个新的,在其上设置文本它在DOM插入之前,然后在DOM插入。
如果你不打算这样做的,那么你就必须测试,看看是否设定这一概念.text()
对已经插入(和解析)的风格标签的工作或不在所有相关的浏览器。
对于脚本标签,我敢肯定,你必须创建一个新的脚本,然后重新插入,但没有办法摆脱已经被解析比重新定义全局符号等旧的代码。 如果你真的想开始对代码新鲜的,你必须从头开始创建一个新的iframe对象。
没有与此太等问题。 你安装.keyup()
每次时间事件处理程序.area_content_box
获得焦点。这很容易与许多安装,全部得到被称为事件处理程序和所有试图做同样的工作的结束。