Блог

Главная - Вопросы по программированию - javascript не работает в IE, если не запущен отладчик

javascript не работает в IE, если не запущен отладчик

#javascript #jquery #debugging #internet-explorer

#javascript #jquery #отладка #internet-explorer

Вопрос:

следующий код отлично работает в FireFox 7, но при открытии той же страницы в IE 9 функции jQuery (скрыть и показать) не работают. Однако, если вы открываете отладчик в IE и обновляете, все работает нормально. Похоже, что код jQuery не будет работать, если не запущен отладчик и вы не обновите страницу (или запустите IE с включенным отладчиком), что, очевидно, затрудняет отладку.

для этого примера включены все CSS и сценарии. Если мне нужно включить какую-либо другую информацию, пожалуйста, дайте мне знать.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<!--<link href="_css/main.css" rel="stylesheet" type="text/css" />-->


 <style>    

html, body {
    margin: 0px;
    padding: 0px;
}

#wrapper {
    width:1000px;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
}
#sidebar {
    width: 100px;
    height:100%;
    float: left;
    background-color: #FF0;
}

#maincontent {
    float: left;
    width: 400px;
    height:100%;
    ;
    background: #c1d8b9;
}
#right {
    width: 500px;
    background-color: #0F3;
    float: right;
    height: 100%;
}



body {
    background-color: white;
}


ul
{
    list-style-type: none;
}
</style> 
 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>



<body>
<div id="wrapper">
  <div id="sidebar"> Sidebar
    <ul >
    </ul>
  </div>
  <div id="maincontent"> Main content
      <button id="hidr">Hide</button>
  <button id="showr">Show</button>
    <ul id="listMiddle">
      <li id="li1">TEST1</li>
      <li id="li2">TEST2</li>
      <li id="li3">TEST3</li>
      <li id="li4">TEST4</li>
    </ul>
  </div>
  <div id="right"> Right
    <ul id="listRight">
    </ul>
  </div>
</div>

<script>    
var arryLIs = document.getElementsByTagName('li');
var middleUL = document.getElementById('listMiddle');
var rightUL = document.getElementById('listRight');
var arrymiddleLIs = middleUL.getElementsByTagName('li');
var arryrightLIs = rightUL.getElementsByTagName('li');


for (var i=0; i<arryLIs.length; i  ){
    arryLIs[i].onclick = moveright; 
    //console.log(arryLIs[i].innerHTML);

}


console.log(arrymiddleLIs);
console.log(middleUL);

var goBefore=null;

function moveright() {
    var goBefore=null;
    goBefore=findSortRight(this);
    document.getElementById('listRight').insertBefore(this,goBefore);
    this.onclick = moveleft;
    //console.log(arrymiddleLIs);
    //console.log(arryrightLIs);

}

function moveleft() {
    document.getElementById('listMiddle').appendChild(this);
    this.onclick = moveright;   
    console.log(arrymiddleLIs);
    console.log(arryrightLIs);  
}

function findSortRight(newElement){
    var goBefore=null;
    for (var r=0; r<arryrightLIs.length; r  ){
        //console.log(newElement.innerHTML<=arryrightLIs[r].innerHTML);
        if (newElement.innerHTML<=arryrightLIs[r].innerHTML) {
            //console.log(arryrightLIs[r]);
            goBefore=arryrightLIs[r];
            break;
        }
    }
//  console.log(goBefore.innerHTML);
    return goBefore;

}



    $("#hidr").click(function () {
      $("li").hide();
    });

    $("#showr").click(function () {
      $("li").show();
    });


</script> 

</body>
</html>

Ответ №1:

console.log это проблема. Удалите его или определите его следующим образом в случае отсутствия перед вызовом:

 console = console || {};
console.log = console.log || function(){};

Комментарии:

1. его удаление решило проблему! объясняет, почему он работал нормально, когда отладчик был запущен. Спасибо за быструю помощь и дополнительную информацию.

2. Это перезаписывает консоль. регистрируйтесь независимо, по крайней мере, в Chrome. console = console || {}; console.log = console.log || function(){}; решает проблему.

3. Используйте решение @user1265146 для IE 9

Ответ №2:

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

Вы могли бы пойти с чем-то вроде:

 if( window.console != undefined) {
    //your console logs goe here
}

Ответ №3:

Ни одно из этих решений не сработало для меня. Вот что я обнаружил, что на самом деле сработало:

 if (typeof(console) === 'undefined') {
    console = { log : function(){ /*alert(arguments[0]);*/ } };
}

Ответ №4:

Вы хотите, чтобы консоль работала, если она действительно определена.

Попробуйте это:

     if (typeof console !== 'undefined') {
        console = {};
        console.log = function() {};
    }