Question

我对JQuery的prop()有一个简单的问题。我用它来检查'if'语句，但现在当我点击它所连接的manualOverrideYes单选按钮时，我无法点击其他按钮。任何人都可以解释我如何使用prop()错误吗？任何和所有的帮助将不胜感激！再次感谢！

HTML：

Manual Overide: 
        <label>No <input type="radio" name="manualOverride" id="manualOverrideNo" value="no" checked /></label>
        <label>Yes<input type="radio" name="manualOverride" id="manualOverrideYes" value="yes" /></label>

        <div id="manualOverrideWarning">test</div>

JS：

$('#manualOverrideYes, #manualOverrideNo').bind('change', function () {
    if($('#manualOverrideYes').prop('checked', true)) {
        $('#manualOverrideWarning').text('Auto-complete Disabled!');
    } else {
        ($('#manualOverrideWarning').text('Auto-complete Enabled'));
    }
});

Answer 1

您正在使用.prop()方法作为一个返回jQuery对象的setter，并且一个对象是JavaScript中的truthy值，您应该将它用作getter，在这种情况下返回一个布尔值：

if ( $('#manualOverrideYes').prop('checked') ) { }

或者，您也可以使用.text()方法回调函数，而不是使用if语句：

$('#manualOverrideYes, #manualOverrideNo').on('change', function () {
    $('#manualOverrideWarning').text(function() {
       return $('#manualOverrideYes').prop('checked')
              ? 'Auto-complete Disabled!'
              : 'Auto-complete Enabled';
    });
});

Answer 2

我很确定这个

if($('#manualOverrideYes').prop('checked', true)) {

应该是这个

if($('#manualOverrideYes').prop('checked')) {

当您只将一个值传递给prop时，就像这样

$('#manualOverrideYes').prop('checked')

它会将checked值返回给您，这是我认为您想要的。但是当您传递第二个参数时，您将属性设置为该第二个值。所以这个

$('#manualOverrideYes').prop('checked', true)

将始终将checked属性设置为true，然后返回jQuery结果集（总是真实的）。

结果是，当您运行if语句时，将始终选中单选按钮，并且if语句将始终返回true。

Answer 3

您也可以使用is(':checked')

$('#manualOverrideYes, #manualOverrideNo').bind('change', function () {
    if ($('#manualOverrideYes').is(':checked')){
        $('#manualOverrideWarning').text('Auto-complete Disabled!');
    } else {
        ($('#manualOverrideWarning').text('Auto-complete Enabled'));
    }
});

使用.prop和now按钮不可点击

3 个答案: