Javascript работает в google, firefox, но не в IE9

Это простой генератор случайных лотерей, он работает в google chrome, firefox. Но это не работает в Internet Explorer 9.Javascript работает в google, firefox, но не в IE9

При использовании функции отладки в IE9 он говорит, что myFunction() в моем HTML является null или undefined. Я новичок в программах кодирования, которые работают с IE, поэтому нам будет очень благодарна любая помощь.

<!DOCTYPE htlm> 
<html> 

    <title>LOTTERY</title> 
    <head> 
    <script> 

    function myFunction() 
    { 

     var myElement = document.getElementById("pwbx"); 
     myElement.value = Math.floor(Math.random() * 11); 

     var myElement = document.getElementById("pwbx1"); 
     myElement.value = Math.floor(Math.random() * 11); 

     var myElement = document.getElementById("pwbx2"); 
     myElement.value = Math.floor(Math.random() * 11); 

     var myElement = document.getElementById("pwbx3"); 
     myElement.value = Math.floor(Math.random() * 11); 

     var myElement = document.getElementById("pwbx4"); 
     myElement.value = Math.floor(Math.random() * 11); 

     var myElement = document.getElementById("pwbx5"); 
     myElement.value = Math.floor(Math.random() * 11); 

    }; 

    </script> 
    <style> 
    .firenze {height: 100px; width: 300px;} .baltimore {border-radius: 11px;} 
    .baltimore{padding-left: 11px !important; padding-top: 11px !important} 
    .baltimore{height: 133px; width: 387px !important;} 
    .baltimore{border: solid 1px black !important;} 
    .como {border: solid 1px black !important;} 
    .como {height: 53px !important; width: 343px !important;} 
    .como {padding-left: 33px !important; padding-top: 18px !important} 
    .foxtrot1 {width: 130px !important;} .foxtrot1 {text-align: center !important;}  
    .echo1 {padding-left: 111px !important; padding-top: 7px !important; } 
    .jessie {padding-top: 63px !important;} 
    .como li {display: inline-block !important; vertical-align: top !important; float: left !important;} 
    .como li {margin: 3 !important;} .bravo {padding-left: 1px !important;} .bravo {font-size: 18px;} 
    .delta {border: solid 1px black !important;} .delta {height: 13px; width: 27px !important;} 
    .delta {padding-bottom: 13px;} .tango {padding-left: 1px !important;} .tango {font-size: 18px;} 
    .yankee {border: solid 1px black !important;} .yankee {height : 13px !important; width: 27px !important;} 
    .yankee {padding-bottom: 13px;} .sierra {padding-left: 1px !important;} .sierra {font-size: 18px;} 
    .uniform {border: solid 1px black !important;} .uniform {height: 13px !important; width: 27px !important;} 
    .uniform {padding-bottom: 13px;} .lima {padding-left: 1px !important;} .lima {font-size: 18px;} 
    .hotel {border: solid 1px black !important;} .hotel {height: 13px !important; width: 27px !important;} .hotel {padding-bottom: 13px;} 
    .romeo {padding-left: 1px !important;} .romeo {font-size: 18px;} .oscar {border: solid 1px black !important;} 
    .oscar {height: 13px !important; width: 27px !important;} .oscar {padding-bottom: 13px;} .zulu {padding-left: 1px !important;} 
    .zulu {font-size: 18px;} .golf {border: solid 1px black !important;} .golf {height: 13px !important; width: 27px !important;} 
    .golf {padding-bottom: 13px;} .power{font-weight: bold; font-size: 17px;} .power {padding-top: 4px;} 
    </style> 
    </head> 
    <body> 

    <div class = "firenze"> 
    <div class = "baltimore"> 
     <ul style="list-style-type: none" id = "dis" class = "como"> 
     <li class = "delta"><output class = "bravo" type = "text" id = "pwbx"></output></li> 
     <li class = "yankee"><output class = "tango" type = "text" id = "pwbx1"></output></li> 
     <li class = "uniform"><output class = "sierra" type = "text" id = "pwbx2"></output></li> 
     <li class = "hotel"><output class = "lima" type = "text" id = "pwbx3"></output></li> 
     <li class = "oscar"><output class = "romeo" type = "text" id = "pwbx4"></output></li> 
     <li>Power Ball:</li> 
     <li class = "golf"><output class = "zulu" type = "text" id = "pwbx5"></output></li> 
    </ul> 
    <span class = "echo1"><input onclick = "myFunction();" value="Generate" type="submit" class = "foxtrot1"></span> 

    </div> 
    </div> 
</body> 
</html>

источник

2015-07-22 TAG

Выходной тег HTML5 и, вероятно, не работает на IE9. Вам нужно будет использовать HTML5 Shim для добавления обратной совместимости.

Вот она работает в JQuery:

<div class = "firenze"> 
<div class = "baltimore"> 
    <ul style="list-style-type: none" id = "dis" class = "como">  
     <li id = "delta" class = "delta"></li> 
     <li id = "yankee" class = "yankee"></li> 
     <li id = "uniform" class = "uniform"></li> 
     <li id = "hotel" class = "hotel"></li> 
     <li id = "oscar" class = "oscar"></li> 
     <li>Power Ball:</li> 
     <li id="golf" class = "golf"></li> 
    </ul> 

     <span class = "echo1"><input value="Generate" type="button" class = "foxtrot1" id="foxtrot1"></span> 

</div> 

</div>

$("#foxtrot1").click(function(){ 
     $("#delta").html(randomToTwo()); 
     $("#yankee").html(randomToTwo()); 
     $("#uniform").html(randomToTwo()); 
     $("#hotel").html(randomToTwo()); 
     $("#oscar").html(randomToTwo()); 
     $("#golf").html(randomToTwo()); 
}); 

function randomToTwo() {  
    return Math.floor(Math.random() * 11); 
}

Затем Вы можете добавить скрытые поля ввода и установить то для отправки формы вместо этого.

Протестировано и работает на IE9.

https://jsfiddle.net/abku3ns1/

источник

2015-07-22 13:03:43

я сузил ошибку, чтобы быть с установкой значения. Попробуйте использовать .innerHTML вместо .value. Кроме того, название должно быть в пределах главы, и ваш doctype имеет орфографическую ошибку (IE указал на все это мне!). Попробуйте использовать структуру цикла всякий раз, когда у вас есть куча повторяющихся задач. Я исправил код, и это работает в IE 11. Так что, надеюсь, он будет работать и с IE 9.

<!DOCTYPE html> 
<html> 
    <head> 
    <title>LOTTERY</title> 
    <script> 
    function myFunction() 
    { 
     for(i = 0; i < 6; i++) 
     { 
      var id = "pwbx" + (i); 
      document.getElementById(id).innerHTML = Math.floor(Math.random() * 11); 
     } 
    } 
    </script> 
    <style> 
     .firenze {height: 100px; width: 300px;} .baltimore {border-radius: 11px;} 
     .baltimore{padding-left: 11px !important; padding-top: 11px !important} 
     .baltimore{height: 133px; width: 387px !important;} 
     .baltimore{border: solid 1px black !important;} 
     .como {border: solid 1px black !important;} 
     .como {height: 53px !important; width: 343px !important;} 
     .como {padding-left: 33px !important; padding-top: 18px !important} 
     .foxtrot1 {width: 130px !important;} .foxtrot1 {text-align: center !important;}  
     .echo1 {padding-left: 111px !important; padding-top: 7px !important; } 
     .jessie {padding-top: 63px !important;} 
     .como li {display: inline-block !important; vertical-align: top !important; float: left !important;} 
     .como li {margin: 3 !important;} .bravo {padding-left: 1px !important;} .bravo {font-size: 18px;} 
     .delta {border: solid 1px black !important;} .delta {height: 13px; width: 27px !important;} 
     .delta {padding-bottom: 13px;} .tango {padding-left: 1px !important;} .tango {font-size: 18px;} 
     .yankee {border: solid 1px black !important;} .yankee {height : 13px !important; width: 27px !important;} 
     .yankee {padding-bottom: 13px;} .sierra {padding-left: 1px !important;} .sierra {font-size: 18px;} 
     .uniform {border: solid 1px black !important;} .uniform {height: 13px !important; width: 27px !important;} 
     .uniform {padding-bottom: 13px;} .lima {padding-left: 1px !important;} .lima {font-size: 18px;} 
     .hotel {border: solid 1px black !important;} .hotel {height: 13px !important; width: 27px !important;} .hotel {padding-bottom: 13px;} 
     .romeo {padding-left: 1px !important;} .romeo {font-size: 18px;} .oscar {border: solid 1px black !important;} 
     .oscar {height: 13px !important; width: 27px !important;} .oscar {padding-bottom: 13px;} .zulu {padding-left: 1px !important;} 
     .zulu {font-size: 18px;} .golf {border: solid 1px black !important;} .golf {height: 13px !important; width: 27px !important;} 
     .golf {padding-bottom: 13px;} .power{font-weight: bold; font-size: 17px;} .power {padding-top: 4px;} 
    </style> 
</head> 
<body> 
    <div class = "firenze"> 
     <div class = "baltimore"> 
      <ul style="list-style-type: none" id = "dis" class = "como">  
       <li class = "delta"><output class = "bravo" type = "text" id = "pwbx0"></output></li> 
       <li class = "yankee"><output class = "tango" type = "text" id = "pwbx1"></output></li> 
       <li class = "uniform"><output class = "sierra" type = "text" id = "pwbx2"></output></li> 
       <li class = "hotel"><output class = "lima" type = "text" id = "pwbx3"></output></li> 
       <li class = "oscar"><output class = "romeo" type = "text" id = "pwbx4"></output></li> 
       <li>Power Ball:</li> 
       <li class = "golf"><output class = "zulu" type = "text" id = "pwbx5"></output></li> 
      </ul> 
      <span class = "echo1"><input onclick = "myFunction()" value="Generate" type="submit" class = "foxtrot1"></span> 
     </div> 
    </div> 
</body> 
</html>

источник

2015-07-22 13:15:15 GobSmack

Javascript работает в google, firefox, но не в IE9

ответ

Смежные вопросы