javascript - 单击 "<button>"时提交表单

Question

我有一个帐户创建表单。没有提交按钮，只有一个<button> 。现在，当单击按钮时，我正在运行 jQuery 验证。正在运行验证并显示正确的错误，但随后会提交表单并重新加载页面。即使我没有提交按钮，也没有 jQuery submit()随时随地发挥作用。

HTML:

<form id="accountCreate" method="POST" action="<?=site_url('account/create')?>">
    <h3>Create an Account</h3>
    <ul>
        <li><input type="text" name="email" placeholder="Email..." /></li>
        <li><input type="password" name="password" placeholder="Password..." id="password" /></li>
        <li><input type="password" placeholder="Verify Password..." id="verifyPassword" /></li>
        <li><button id="button">Create</button></li>
    </ul>
</form>

JS:

$(document).ready(function() {
$('#button').click(function() { 
    var password = $('input#password').val();
    var passwordV = $('input#passwordVerify').val();

    if (password.length >= 6 && password.length <= 24) {
        if (password == passwordV) {

        } else {
            $('div#error').css('display', 'inline');
            $('div#error span.errorMessage').text('hey');
        }
    } else {
        alert('yo');
        return false;
    }
});
});

Answer 1

当没有type时属性定义为<button />充当提交按钮。
添加type="button"来解决这个问题。

<button id="button" type="button">Create</button>

http://www.w3.org/TR/html-markup/button.html#button