0

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

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;
    }
});
});
4

4 回答 4

5

当没有type定义属性时，将<button />充当提交按钮。
添加type="button"以解决此问题。

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

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

于 2013-07-12T06:55:30.187 回答
2

您需要为按钮指定默认type=属性，因为不同的浏览器可以使用不同的默认值。在您的情况下，浏览器似乎已默认为type="submit".

于 2013-07-12T06:55:08.360 回答
0 
$(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;
}
//Just add return false
return false;
});
});
于 2013-07-12T06:57:12.870 回答
0

您应该添加evt.preventDefault();以使提交仅执行您想要的操作。

于 2013-07-12T06:57:32.023 回答