JS проблема с getElementById в проводнике - PullRequest
Новая
       29

JS проблема с getElementById в проводнике

0 голосов
/ 24 августа 2009

HTML-код (с JavaScript), показанный ниже, работает во всех браузерах, кроме IE.

Недавно я узнал, что IE не хочет обрабатывать коды getElementById и id.

Кто-то так любезно посоветует мне, есть ли другой способ заставить его работать или есть обходной код?

Заранее спасибо, Эрик 

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<title>test</title>
<script type="text/javascript">
<!--
var color = new Object();

color["100"] = new Array("300", "400");

color["200"] = new Array("100", "300", "400");

color["300"] = new Array("100", "200");

color["400"] = new Array("200");

var colors = new Array("related");

function on(id)
{
for (var i=0; i<color[id].length; i++)
{
var el = document.getElementById("index_"+color[id][i]);
if (el)
{
el.setAttribute("class", colors[i%1]);
}
}
}

function off(id)
{
for (var i=0; i<color[id].length; i++)
{
var el = document.getElementById("index_"+color[id][i]);
if (el)
{
el.removeAttribute("class");
}
}
}
//-->
</script>

<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 18px;
color: #000000;
text-decoration: none;
}
a:link,
a:visited {
color: #000000;
text-decoration: none;
}

a:hover,
a:active {
color: #FF0000;
text-decoration: underline;
}
a.related {
color: #FF0000;
text-decoration: none;
}
-->
</style>
</head>

<body>

<a href="#" id="index_100" name="index_100" onMouseOver="on(100)" onMouseOut="off(100)">aaa</a><br />
<br />
<a href="#" id="index_200" name="index_200" onMouseOver="on(200)" onMouseOut="off(200)">bbb</a><br />
<br />
<a href="#" id="index_300" name="index_300" onMouseOver="on(300)" onMouseOut="off(300)">ccc</a><br />
<br />
<a href="#" id="index_400" name="index_400" onMouseOver="on(400)" onMouseOut="off(400)">ddd</a>

</body>
</html>

Ответы [ 3 ]

2 голосов
/ 24 августа 2009

el.removeAttribute ( "класс");

Это не сработает. Избегайте getAttribute / setAttribute / removeAttribute в IE, они не поддерживаются должным образом. IE до версии 8 путает доступ к атрибуту с доступом к свойству объекта JS, что приводит к ошибочным ошибкам, когда атрибут имеет другое имя (class vs className) или тип свойства отличается (логические или целочисленные свойства, где атрибут всегда является строкой). 1005 *

Лучше (более читабельно и кросс-браузерно совместимо) использовать свойства HTML DOM: 

el.className= '';

Нет необходимости указывать и "id" , и"name" для a-элементов; просто установите «id» самостоятельно.

1 голос
/ 24 августа 2009

вы пытаетесь использовать setAttribute () для установки "класса". Хотя это технически полностью допустимо, IE имеет ошибку с setAttribute () и не будет ее устанавливать.

используйте это для IE 

el.setAttribute("className", colors[i%1]);
0 голосов
/ 24 августа 2009

Нужно ли даже элементам <a> атрибут name?

Если нет, то вам, вероятно, было бы лучше без них уменьшить фактор «шума».

Проблема, однако, может заключаться в том, что более точные сведения о разметке генерируются какой-то структурой (Struts, ASP.NET) - и у вас нет возможности контролировать, получаете ли вы атрибут name или нет.

...