This is a simple Lottery random generator, it works in google chrome, firefox. But it does not work in internet explorer 9.
这是一个简单的彩票随机生成器,它适用于谷歌Chrome,Firefox。但它在Internet Explorer 9中不起作用。
When I use the debugging feature in IE9 it says that myFunction() in my HTML is null or undefined. I am new with coding programs that work with IE, so any kind of help would be greatly appreciated.
当我在IE9中使用调试功能时,它说我的HTML中的myFunction()为null或未定义。我是新的编码程序与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>
2 个解决方案
#1
1
The output Tag is HTML5 and probably wont work on IE9. You would need to use HTML5 Shim to add backwards compatibility.
输出标签是HTML5,可能不适用于IE9。您需要使用HTML5 Shim来添加向后兼容性。
Here is it working in jQuery:
这是在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>
JS
$("#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);
}
You could then add hidden input fields and set then for the form submit instead.
然后,您可以添加隐藏的输入字段,然后为表单提交设置。
Tested and working on IE9.
测试并在IE9上工作。
#2
0
I narrowed down the fault to be with setting the value. Try using .innerHTML instead of .value. Also, Title should be within Head and your doctype has a spelling mistake (IE pointed this all out to me!). Try using loop structure whenever you have a bunch of repetitive tasks. I have corrected the code and this works in IE 11. So hopefully it will work with IE 9 as well.
我将故障缩小到设定值。尝试使用.innerHTML而不是.value。此外,标题应该在Head内,你的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>
#1
1
The output Tag is HTML5 and probably wont work on IE9. You would need to use HTML5 Shim to add backwards compatibility.
输出标签是HTML5,可能不适用于IE9。您需要使用HTML5 Shim来添加向后兼容性。
Here is it working in jQuery:
这是在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>
JS
$("#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);
}
You could then add hidden input fields and set then for the form submit instead.
然后,您可以添加隐藏的输入字段,然后为表单提交设置。
Tested and working on IE9.
测试并在IE9上工作。
#2
0
I narrowed down the fault to be with setting the value. Try using .innerHTML instead of .value. Also, Title should be within Head and your doctype has a spelling mistake (IE pointed this all out to me!). Try using loop structure whenever you have a bunch of repetitive tasks. I have corrected the code and this works in IE 11. So hopefully it will work with IE 9 as well.
我将故障缩小到设定值。尝试使用.innerHTML而不是.value。此外,标题应该在Head内,你的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>