Очень странная проблема краха IE с объектом javascript таблицы стилей - PullRequest
Новая
       0

Очень странная проблема краха IE с объектом javascript таблицы стилей

0 голосов
/ 03 мая 2011

Здравствуйте, я использую объект таблицы стилей javascript со специфическим стилем и помещаю его в dom ready. Когда я делаю именно мой код IE сбой.

Проблема в том, что UL с этим стилем устанавливается именно после загрузки страницы. Если я помещу styleSheet.cssText = css; перед загрузкой страницы, все правильно. Если я уберу символ f в <DIV>f, все будет работать. Мне нужно использовать мой код после загрузки страницы. Любое предложение обойти эту проблему? 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>test</title>
<script type="text/javascript" src="./jquery-1.4.2.min.js" ></script>
<script type="text/javascript"> 
 var styleSheet = document.createStyleSheet();
 var css= "UL{list-style-type:none;display:inline;}LI{padding:0px;}";
$(document).ready(function(){
styleSheet.cssText = css;

});
</script>
</head>
<body>
<DIV>f
<UL>
<LI><a>dfgfdg</a></LI>
<LI><a>fdgdfg</a></LI></UL>?
</DIV>?
</body>
</html>

Ответы [ 4 ]

3 голосов
/ 03 мая 2011

Проблема специфична для IE8. Кажется, работает на ie7 и ie9.

Чтобы воспроизвести ошибку, важно применить таблицу стилей после загрузки страницы. Мы использовали jquery.ready () для этого примера, но код также дает сбой для событий click и load. Эта ошибка очень специфична. Требуются точные CSS и HTML, используемые в примере выше. Мы попытались добавить таблицу стилей различными способами (например, stylesheet.rules [i] .lisStyleType = 'none' и добавить таблицу стилей в файл .css), но безуспешно. Нам абсолютно необходимо динамически добавлять стиль там, где происходит эта проблема.

1 голос
/ 03 мая 2011

createStyleSheet не является кросс-браузерным решением ... Попробуйте вместо этого код: 

$(function(){
    var styles = "UL{list-style-type:none;display:inline;}LI{padding:0px;}";
    var newSS=document.createElement('link');
    newSS.rel='stylesheet';
    newSS.href='data:text/css,'+escape(styles);
    document.getElementsByTagName("head")[0].appendChild(newSS);
});

Я не могу точно сказать вам, почему IE падает, но этот код работает для меня, и он не должен вызывать каких-либо неожиданных ошибок.

0 голосов
/ 16 мая 2011

Пожалуйста, попробуйте это.Протестировано в IE6,7,8,9 FF, Opera, Googlechrome, Safari 

<script type="text/javascript">
function createRuntimeStyle(){
//create a style tag
var rStyle=document.createElement("style");

//create the content of the style tag
var cssDef=document.createTextNode(".myclass{display:block;font-family:Verdana;font-weight:bold;}");

//assign the type
rStyle.type="text/css";


if(rStyle.styleSheet){  //check for IE
rStyle.styleSheet.cssText=cssDef.nodeValue;
}else{ //check for Other Browsers
rStyle.appendChild(cssDef);
}

//append to document head
document.getElementsByTagName("head")[0].appendChild(rStyle);
}

//call to the function
createRuntimeStyle();
</script>
0 голосов
/ 03 мая 2011

Я попробовал ваш код в jsfiddle и он не работает с IE7 .. в чем проблема?

Какую версию IE вы используете?У вас есть URL демо-версии, которая рушится для вас?Я не могу воспроизвести вашу проблему, см. Мой jsfiddle ...

Кстати, почему вы используете jquery 1.4.2, а не более новую версию?1.4.4 или 1.5.2, в jsfiddle я выбрал 1.4.4

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...