javascript - 点击简单按钮时页面会刷新？

Question

大家。正如你所看到的，我有一个表格，里面有一个按钮。单击按钮时，我想执行一些 JavaScript 代码(对于这个问题并不重要)。

当我点击删除按钮时，我的页面会刷新，但这不是我想要的。你们知道为什么我的页面在点击按钮时会刷新吗？

HTML 代码

<form id="form" method="POST"> 
    <button type="button "id="delete" name="delete" onclick="delete_data();"><i class="fa fa-remove" aria-hidden="true"></i> Delete Zone(s)</button>
</form>

Javascript代码

function delete_data(){
        //this function is used to obtain id's of selected checkboxes.

        var checkedIds = $(".chk:checked").map(function() {
            return this.id;
        }).toArray();

        alert(checkedIds);
    }

Answer 1

您应该防止发生默认行为:

function delete_data(event){
        event.preventDefault();
        //this function is used to obtain id's of selected checkboxes.

        var checkedIds = $(".chk:checked").map(function() {
            return this.id;
        }).toArray();

        alert(checkedIds);
    }