Question

我有以下jQuery检查提交表单：

$('#register_button').click(function (e) {
    var valid = true;
    $('.controls input').each(function () {
        if ($(this).siblings().hasClass('error')) {
            valid = false;
            alert('errors!');
            e.preventDefault();
            return false;
        }
    });
});

以下是输入的HTML结构：

<div class="controls">
    <input type="text" name="register_postcode" id="register_postcode" value="<?=(isset($_REQUEST['register_postcode']) ? $_REQUEST['register_postcode'] : 'xxxxxx')?>" />                    
    <div class="info">&nbsp;</div>
    <div class="valid" style="display:none;">&nbsp;</div>
    <div class="error" style="display:none;">&nbsp;</div>
</div>

提交表单时，警报会显示错误。

但是当我提交表单并且没有错误时，警报仍会显示，表单未提交。

有什么想法吗？

Answer 1

如果输入元素有效，我可以看到，你没有删除类error的元素，它只是隐藏。

所以改变你的测试，不要检查是否有一个同级error的同胞，error是否可见

$('#register_button').click(function (e) {
    var valid = true;
    $('.controls input').each(function () {
        if ($(this).siblings('.error:visible').length) {
            valid = false;
            alert('errors!');
            e.preventDefault();
            return false;
        }
    });
});

您也可以

$('#register_button').click(function (e) {
    if($('.controls .error:visible').length){
        alert('errors!');
        e.preventDefault();
    }
});

jquery如果兄弟姐妹有类

1 个答案: