-1

如果未选中复选框并且文本框为空，那么我需要弹出验证消息。它确实会弹出，但会在输入时删除文本，使其保持无效。我该如何做到这一点，以便在输入第一个字符时验证消失并且除非文本框为空白，否则不会重新出现？

<form  id="practiceForm">
    <input type="text" name="firstName" id="textbox"/>
    <input type="checkbox" name="active" id="checkbox"/>
    <input type="submit" id="submit" value="Submit"/>
</form>

<script type="text/javascript">
    $('#checkbox').attr('checked', true);

    if($('#checkbox').attr('checked')){
        $('#textbox').attr('disabled', true);
        $('#textbox').val('');
    } else {
        $('#textbox').attr('disabled', false);
    };


$('#checkbox').change(function () {
    if($('#checkbox').attr('checked')){
        $('#textbox').attr('disabled', true);
        $('#textbox').val('');
    } else {
        $('#textbox').attr('disabled', false);
    };
});

$.validator.addMethod("textValidate", function(value){
    if(!$('#checkbox').attr('checked')){
        if(!$('#textbox').val('') || !$('#textbox').val(null)){

            return true;
        };
    };  
}, "If box is not checked then there must be text"
);


$('#practiceForm').validate({
    rules: {
        //textValidate: true
        firstName:{ 
                    textValidate: true
                    }
                }
            });

</script>
4

2 回答 2

2

textValidate您的方法中的这个逻辑被破坏了：

if(!$('#textbox').val('') || !$('#textbox').val(null)){

您没有检查 a valueof ''or null，而是将其设置为value. 由于在每个按键事件上都会调用该方法，因此它会在您键入时清除输入。

试试这个：

$.validator.addMethod("textValidate", function (value) {
    if (!$('#checkbox').attr('checked')) {
        if (!$('#textbox').val() == '' || !$('#textbox').val() == null) {
             return true;
        };
    };
}, "If box is not checked then there must be text");

工作演示：http: //jsfiddle.net/s2AjA/

附带问题：

您不需要大部分代码...

$('#checkbox').attr('checked', true);

if($('#checkbox').attr('checked')){
    $('#textbox').attr('disabled', true);
    $('#textbox').val('');
} else {
    $('#textbox').attr('disabled', false);
};

它仅在 DOM 就绪时运行一次，并且由于您设置#checkbox为checked，因此if/then看起来像checked属性的条件是完全多余和不必要的。

它可以更简单地写成如下。也改变了attr在prop技术上比attr使用 jQuery 1.6+ 时更正确。

$('#checkbox').prop('checked', true);
$('#textbox').prop('disabled', true);
$('#textbox').val('');
于 2013-02-03T01:53:03.727 回答
0 
if(!$('#textbox').val('') || !$('#textbox').val(null)){

将值设置#textbox为“”然后为空，并使该 if 语句始终返回 false。

你的意思可能是这样的：

if ($('#textbox').val() != '' || $('#textbox').val() != null) {
于 2013-02-03T01:49:04.463 回答