Форум

werty1001 · #1 (**permalink**) 07.04.2014, 10:13

Здравствуйте, подскажите в чем может быть проблема, с данным кодом в ie8:

ссылка на jsfiddle или

(function() {
      
var show = document.querySelectorAll('[data-show]');
var div =  document.querySelectorAll('[data-div]');
    
for (var i=show.length; i--;) {
    
if (!show[i].addEventListener) {
    
    show[i].attachEvent("onclick", function() {document.querySelector("[data-div="+ this.getAttribute('data-show') +"]").style.display = 'none';});
   
} else {
    
    show[i].addEventListener("click", function() { document.querySelector("[data-div="+ this.getAttribute('data-show') +"]").style.display = 'none';});
    
       }   
    
} // for
    
})(); // end

<span data-show="val">раз</span> <br /><br />

<span data-show="valval">два</span> <br /><br />

<div data-div="val">блок val</div> <br /><br />
<div data-div="valval">блок valval</div>

Гуглил долго, но понять так и не могу, что не так. Если установить значение атрибута в id элемента - работает, значит ослик понимает команду "getAttribute". JS начал осваивать недавно, может какой банальности не замечаю?

ksa · #2 (**permalink**) 07.04.2014, 10:36

Сообщение от werty1001

значит ослик понимает команду "getAttribute"

8-го нет под рукой... А в 9-том работает

<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
function test() {
	alert(document.getElementById('test').getAttribute('data-value'));
};
</script>
</head>
<body>
<div id='test' data-value='data'></div>
<button onclick='test();'>Test</button>
</body>
</html>

werty1001 · #3 (**permalink**) 07.04.2014, 10:49

Сообщение от ksa

8-го нет под рукой... А в 9-том работает

Я в 10 в режиме совместимости проверяю и в ietester еще. В IE9 мой код работает и Ваш пример естественно тоже. В IE8 ваш пример работает, а вот мой уже нет. В моем коде в IE10(в режиме IE8) в консоли при клике на <span> выдает "Объект не поддерживает свойство или метод "getAttribute". Но ваш пример работает значит дело в другом.

ksa · #4 (**permalink**) 07.04.2014, 11:08

Сообщение от werty1001

при клике на <span> выдает "Объект не поддерживает свойство или метод "getAttribute". Но ваш пример работает значит дело в другом

Так у меня ДИВ, не СПАН... Если поменять, мой пример так же работает в 8-м ИЕ?

рони · #5 (**permalink**) 07.04.2014, 11:39

werty1001,
а так?

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo by werty1001</title>
 <script type='text/javascript'>
window.onload=function(){
(function() {

var show = document.querySelectorAll('[data-show]');
var div =  document.querySelectorAll('[data-div]');

for (var i=show.length; i--;) {

if (!show[i].addEventListener) {

    show[i].attachEvent("onclick",(function(el) { return function() {document.querySelector("[data-div="+ el.getAttribute('data-show') +"]").style.display = 'none';}})(show[i]));

} else {

    show[i].addEventListener("click", function() { document.querySelector("[data-div="+ this.getAttribute('data-show') +"]").style.display = 'none';});

       }

}

})();
}

</script>


</head>
<body>
  <span data-show="val">раз</span> <br /><br />

<span data-show="valval">два</span> <br /><br />

<div data-div="val">блок val</div> <br /><br />
<div data-div="valval">блок valval</div>

</body>


</html>

werty1001 · #6 (**permalink**) 07.04.2014, 14:05

Сообщение от ksa

Так у меня ДИВ, не СПАН... Если поменять, мой пример так же работает в 8-м ИЕ?

Да

рони,
Спасибо, так работает. Плюс в карму что-не пашет. Еще раз спасибо.

ksa · #7 (**permalink**) 07.04.2014, 14:13

Сообщение от werty1001

Плюс в карму что-не пашет.

По законам этого леса (с) одному человеку не дают несколько раз подряд ставить +/-... Вот другим наставишь - тогда опять разрешат...

Форум

Справочник

Discord чат

Курсы javascript