Question

我现在正在探索javascript。以下代码正确运行，但在我单击按钮后，页面刷新。这是不希望的。任何帮助都会得到满足。提前致谢。

<html>
<head>
</head>
<body >  
<form>
<input onchange="chk_change();" type="checkbox" id="chk_city" checked="checked"><label     for="chk_city">All cities</label></input><br>
<select id="sel1" style="display:none;margin:20 0 0 0;padding:3; width:100">
<option id="opt1">London
<option id="opt2">Moscow
<option id="opt3">Tokyo</option>
</select>
<br>
<button id="btn1" onclick="aa();">Go</button><br>
<p id="p1" style="border:1px solid black;width:200;height:50"></p>
</form>
</body>



<script type="text/javascript" >
function chk_change(){

var ch=document.getElementById('chk_city').checked;
    if (ch ==true){
     ch=document.getElementById('sel1').style.display='none';
    }
    else {
    ch=document.getElementById('sel1').style.display='block';
    }

}



function aa(){

sel = document.getElementById('sel1');

var text=(sel.options[sel.selectedIndex].text);
var ch=document.getElementById('chk_city').checked;
    if (ch ==true){
    document.getElementById('p1').innerText="All cities";
    }
    else{
    document.getElementById('p1').innerText=text;
    }
}

</script>


</html>

Answer 1

表单中任何按钮的默认行为是提交按钮，这意味着它将导致页面重新加载。在按钮上设置属性type='button'，它将仅作为普通按钮，而不提交任何内容。

为什么在运行此脚本后重新加载页面

1 个答案: