Javascript IE8 iframe未成功运行JS/CSS代码
我目前正在通过iframe将一个日历应用程序嵌入到一个网站中，但我在InternetExplorer中遇到了一个bugJavascript IE8 iframe未成功运行JS/CSS代码,javascript,jquery,internet-explorer,iframe,slickgrid,Javascript,Jquery,Internet Explorer,Iframe,Slickgrid,我目前正在通过iframe将一个日历应用程序嵌入到一个网站中，但我在InternetExplorer中遇到了一个bug function BuildListView(startday, l, events, config){ var cc = '<div id="myGrid" style="width:95%;height:95%;"></div>'; var html = []; html.push(cc);
function BuildListView(startday, l, events, config){
var cc = '<div id="myGrid" style="width:95%;height:95%;"></div>';
var html = [];
html.push(cc);
html.push('<link rel="stylesheet" href="../slickgrid/slick.grid.css" type="text/css" media="screen" charset="utf-8" /> ');
html.push('<link rel="stylesheet" href="../slickgrid/css/smoothness/jquery-ui-1.8.2.custom.css" type="text/css" media="screen" charset="utf-8" /> ');
html.push('<link rel="stylesheet" href="../slickgrid/examples/examples.css" type="text/css" media="screen" charset="utf-8" /> ');
html.push('<script language="JavaScript" src="../slickgrid/lib/jquery.event.drag-2.0.min.js"></script>');
html.push('<script language="JavaScript" src="../slickgrid/slick.grid.js"></script>');
gridcontainer.html(html.join(""));
html = null;
var grid;
var columns = [
{id:"event", name:"Event", field:"event",width:300},
{id:"start", name:"Start", field:"start",width:175},
{id:"finish", name:"Finish", field:"finish",width:175},
{id:"location", name:"Location", field:"location",width:200}
];
function sortByStart(a, b) {
var x = a.start.toLowerCase();
var y = b.start.toLowerCase();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
var options = {
enableCellNavigation: false,
enableColumnReorder: false,
rowCssClasses: function(item) {
// if a task is 100% done then its row gets an additional CSS class
return (item.event == "Task 0") ? 'complete' : '';
}
};
$.getJSON("../cal.php", function(json) {
var data = [];
var i=0;
$.each(json.events, function(index, event) {
data[i++] = {
event: event[1],
start: event[2],
finish: event[3],
location: event[9],
};
});
data.sort(sortByStart);
$.each(data,function(index, value){
value.start = (new Date(value.start)).toUTCString();
value.finish = (new Date(value.finish)).toUTCString();
})
grid = new Slick.Grid($("#myGrid"), data, columns, options);
});
}
正在引发问题。当我注释掉CSS文件时也会发生同样的事情，所以我假设这是一个加载后的CSS错误。什么可以阻止iframe中的CSS被更改？您是否检查了DOCTYPE？某些doctype在FF/Chrome中触发标准模式，但在IE8中触发怪癖模式。SlickGrid在怪癖模式下不工作（这并不奇怪！）。我刚刚通过更改此选项修复了一个非常类似的问题：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
您检查过您的DOCTYPE了吗？某些doctype在FF/Chrome中触发标准模式，但在IE8中触发怪癖模式。SlickGrid在怪癖模式下不工作（这并不奇怪！）。我刚刚通过更改此选项修复了一个非常类似的问题：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
这有点模糊，很难理解。什么不起作用，有什么确切的错误消息？实际上没有任何错误消息，所有数据都被加载，只是CSS从未应用。您是否在iframe文档中嵌入了所有必要的slickgrid CSS文件（参见slickgrid示例）？CSS路径是否正确（相对于iframe中的文档）？这有点模糊，很难进入。什么不起作用，有什么确切的错误消息？实际上没有任何错误消息，所有数据都被加载，只是CSS从未应用。您是否在iframe文档中嵌入了所有必要的slickgrid CSS文件（参见slickgrid示例）？CSS路径是否正确（相对于iframe中的文档）？在你的代码前用四个空格，这样HTML就会被忽略。在你的代码前用四个空格，这样HTML就会被忽略。