button的onclick怎么放在JS里，这段代码有啥问题

weixin_39038667 2017-06-24 01:01:50

<!DOCTYPE html>
<html>
<head>
<title>函数练习</title>
<script type="text/javascript">

var obtn=document.getElementById("btn1");

obtn.onclick=function comValue(x1,x2)
{
var x1=document.getElementById('text1').value;
var x2=document.getElementById('text2').value;

if(x1>x2)
{
alert(x1+"比较大")
}
else if(x1<x2)
{
alert(x2+"比较大")
}
else
{
alert("一样大")
}

}

</script>
</head>
<body>
<input id="text1" type="txt" value="2">
<input id="text2" type="txt" value="4">
<input id="btn1" type="button" value="比较" >

</body>
</html>

...全文

134 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

霜月枫桥 2017-06-24

打赏
举报

将<script>放在<body>的后面就行了，比如 <!DOCTYPE html> <html> <head> <title>函数练习</title> </head> <body> <input id="text1" type="txt" value="2"> <input id="text2" type="txt" value="4"> <input id="btn1" type="button" value="比较" > <script type="text/javascript"> var obtn=document.getElementById("btn1"); obtn.onclick=function comValue(x1,x2) { var x1=document.getElementById('text1').value; var x2=document.getElementById('text2').value; if(x1>x2) { alert(x1+"比较大") } else if(x1<x2) { alert(x2+"比较大") } else { alert("一样大") } } </script> </body> </html> 因为HTML是按照从上向下的顺序执行的，如果你不想变换位置，也可以将你的button点击方法放在 window.onload=function(){……}中，

当作看不见 2017-06-24

打赏
举报

把你的js代码放到文件HTML文件尾部就没有问题了,由于js获取元素,getElementById 的时候,元素btn1还没有被加载,所有获取不到对象二,直接使用btn1,html 的id会在js声明为一个全局变量,可以直接调用,无论是否声明,或者优先引用


<!DOCTYPE html>
<html>
<head>
<title>函数练习</title>
<script type="text/javascript">
btn1.onclick=function comValue(x1,x2)
{
var x1=document.getElementById('text1').value;
    var x2=document.getElementById('text2').value;

if(x1>x2)
{
alert(x1+"比较大")
}
else if(x1<x2)
{
alert(x2+"比较大")
}
else
{
alert("一样大")
}

}


</script>
</head>
<body>
<input id="text1" type="txt" value="2">
<input id="text2" type="txt" value="4">
<input id="btn1" type="button" value="比较" >

</body>
</html>