Question

我有一个包含很多组件的网页。有很多按钮，当我点击它们时，它们不会重新加载页面，但是当我点击此代码中的按钮时

<div style="width:300px; height:250px; float:left; position:absolute; z-index:4">
    <form style="width:100%;">
        <fieldset style="width:250px; height:210px;">
        <legend><b>Authors</b></legend>
        <div id="authors" style="width:250px; height:150px; position:absolute; overflow:scroll">
            <div style="white-space: nowrap;">
                <button class="button removeclick" style="display:block; float:left;"><img src="img/list-remove.png" alt="remove" /></button>
                <button class="button upclick" style="display:block; float:left;"><img src="img/arrow-up.png" alt="arrow-up" /></button>
                <button class="button downclick" style="display:block; float:left;"><img src="img/arrow-down.png" alt="arrow-down" /></button> 
                <input  class="resizable" type="text" style="height:29px"/>
            </div>
            <div style="white-space: nowrap;">
                <button class="button removeclick" style="display:block; float:left;"><img src="img/list-remove.png" alt="remove" /></button>
                <button class="button upclick" style="display:block; float:left;"><img src="img/arrow-up.png" alt="arrow-up" /></button>
                <button class="button downclick" style="display:block; float:left;"><img src="img/arrow-down.png" alt="arrow-down" /></button> 
                <input  class="resizable" type="text" style="height:29px"/>
            </div>
        </div>
        <div style="position:absolute; top:180px;"><button id="add" class="button" style="display:block; float:right;"><img src="img/add_new.png" alt="add new" /> Add New</button></div>
        </fieldset>
    </form>
    </div>

页面重新加载，我不知道为什么。我不需要这种行为。

Answer 1

将开头表格标签更改为：

<form style="width:100%;" onsubmit="return false;">

Answer 2

因为它们在form内，如果您不需要提交，则无需提供表单，请删除

<form style="width:100%;">

和

 </form>

Answer 3

从代码中删除表单属性，表单属性中的输入字段在Enter上按下表单提交..

Answer 4

删除标记form，它应该有效。

Answer 5

所有按钮都必须位于表单标记内。

单击位于表单标记内的按钮，会将表单提交并发布到服务器端。

Answer 6

如果您不想重新加载页面，请在您的javascript中尝试preventDefault();：

在jQuery中像这样：

$("#buttonID").click(function(e){

    e.preventDefault();

});

单击按钮时重新加载页面

6 个答案: