Question

我正在进行表单验证，并希望检查一些单选按钮值。默认情况下，不会选择任何值。每个问题有两种选择 - 是和否。

首先，我隐藏'警告信息'并检查其中一个输入是否改变。我想要发生的是当所有选项都设置为no（值为N）时，将显示错误消息，否则它将隐藏。我想要它，以便如果任何选项随后更改为yes，则错误消息将隐藏。这里发生的是，如果错误消息显示任何值更改为yes。也许我已经过度复杂了这应该如何运作？

$('.cautionMessage').hide();
$('.weeeDetailsChange input').change(function () {
    var ownBrand = $('input[name="ownbrand"]:checked').val();
    var resell = $('input[name="resell"]:checked').val();
    var ImportBasis = $('input[name="importbasis"]:checked').val();
    var distributeEEE = $('input[name="distributeeee"]:checked').val();
    var exportEU = $('input[name="exporteu"]:checked').val();
    var distanceSelling = $('input[name="distanceselling"]:checked').val();

    if ( ownBrand && resell && ImportBasis && distributeEEE && exportEU && distanceSelling === 'Y' ) {
        $('.cautionMessage').show();
        console.log('Show');
    } else {
        $('.cautionMessage').hide();
        console.log('Hide');
    }
});

Answer 1

啊，我看到发生了什么 - 可能只是需要一双新的眼睛。

您目前正在做的是检查只有 distanceSelling 是，而您应检查所有值否并运行基于此显示/隐藏，因为如果任何值为“是”，则要显示消息。

尝试以下方法：

$('.cautionMessage').hide();
$('.weeeDetailsChange input').change(function () {
    var ownBrand = $('input[name="ownbrand"]:checked').val();
    var resell = $('input[name="resell"]:checked').val();
    var ImportBasis = $('input[name="importbasis"]:checked').val();
    var distributeEEE = $('input[name="distributeeee"]:checked').val();
    var exportEU = $('input[name="exporteu"]:checked').val();
    var distanceSelling = $('input[name="distanceselling"]:checked').val();

    if (ownBrand == 'N' && resell == 'N' && ImportBasis == 'N' && distributeEEE == 'N' && exportEU == 'N' && distanceSelling == 'N' ) {
        // all values are 'N'
        $('.cautionMessage').show();
        console.log('Show');
    } else {
        // not all values are 'N'
        $('.cautionMessage').hide();
        console.log('Hide');
    }
});

我希望我理解正确。希望有所帮助！

Answer 2

我做了几处改动。我使用已检查的属性prop('checked')而不是val()，因为它实际上返回了一个布尔值，因此我无需将其与y或其他任何内容进行比较。然后我翻转隐藏并显示仅在检查所有复选框时隐藏警告消息的位置。 Click here to see example

$('.caution').hide();
$(".weeeDetailsChange").change(function(){
var ownBrand =  $('input[name="ownbrand"]:checked').prop('checked')
var resell =$('input[name="resell"]:checked').prop('checked')
var ImportBasis = $('input[name="importbasis"]:checked').prop('checked')
var distributeEEE = $('input[name="distributeeee"]:checked').prop('checked')
var exportEU = $('input[name="exporteu"]:checked').prop('checked')
var distanceSelling = $('input[name="distanceselling"]:checked').prop('checked')

if ( ownBrand && resell && ImportBasis && distributeEEE && exportEU && distanceSelling) {
    $('.caution').hide();
    console.log('hide');
} else {
    $('.caution').show();
    console.log('show');
}
});

jQuery - 字段值和比较

2 个答案: