解决button按钮点击后自动刷新页面的问题

景嘉实
2023-12-01

标题解决button按钮点击后自动刷新页面的问题

问题
页面上有一个查询按钮为Button标签,点击查询按钮后会自动刷新页面,令人费解,查资料后发现是button的默认行为导致的。

<button class="btn btn-default active" id="btnAdd" click="selectData()">查询</button>

原因
button,input type=button按钮在IE和w3c,firefox浏览器区别:
1、当在IE浏览器下面时,button标签按钮,input标签type属性为button的按钮是一样的功能,不会对表单进行任何操作。
2、但是在W3C浏览器,如Firefox下就需要注意了,button标签按钮会提交表单,而input标签type属性为button不会对表单进行任何操作。
三、解决办法
法一:将button标签更换为input

<input class="btn btn-default active" id="btnAdd" value="查询" onclick="selectData()"></input>

法二:为button按钮增加一个type=”button”属性

<input type="button" class="btn btn-default active" id="btnAdd" value="查询" onclick="selectData()"></input>
 类似资料: