使用 jQuery 将复选框的值设为 1/0

Posted 2023-02-24

【中文标题】使用 jQuery 将复选框的值设为 1/0

【英文标题】：Get value of checkbox as 1/0 with jQuery

【发布时间】：2013-11-16 07:25:22

【问题描述】：

我想用 jQuery 获取所有输入字段的值。我可以用下面的代码做到这一点。但是，如果输入字段是复选框，并且它被选中，它将返回“on”。如果选中，如何获得 1 的值？

jQuery：

$('button').click(function() 

    inputs = $('.input');
    inputs.each(function() 
        var value = $(this).val();  
        alert(value);
    ); 

);

HTML：

<input type="text" class="input" />
<input type="text" class="input" />
<input type="checkbox" class="input">

<button>Get values<button>

演示： http://jsfiddle.net/yDKdT/

【参考方案1】：

你需要检查你的元素类型是否等于checkbox:

if( $( this ).attr( 'type' ) === 'checkbox' ) 
    value = +$(this).is( ':checked' );

提示：+ 符号会将布尔值转换为整数：1/0

查看更新的jsFiddle

【参考方案2】：

DEMO

var input = $('.input');

$('button').click(function() 

    input.each(function()       
      var val = this.type=="checkbox" ? +this.checked : this.value ;      
      alert(  val  );
    ); 

);

是做什么的：

this.type=="checkbox" // Test if htmlElement type is checkbox // (Boolean)
?
+this.checked // if true  // using '+', set boolean (true/false) to int (0/1)
:
this.value    // if false // just get the value
; 

_{补充阅读：Convert boolean result into number/integer}

【参考方案3】：

使用 .is(':checked') 而不是获取值。 如果选中，这会将其作为布尔值返回，而不是“开启”。

【参考方案4】：

你可以试试这个。

$('button').click(function() 

    inputs = $('.input');
    inputs.each(function() 
        var value;
        if( $( this ).attr( 'type' ) === 'checkbox' ) 
            value = $(this).is( ':checked' ) ? 1: 0;
        else
        
            value = $(this).val();
        
        alert(value);
    ); 

); 

DEMO

【参考方案5】：

 inputs.each(function () 
        if($(this).attr('type') == "checkbox") 
            value = $(this).prop('checked') == false ? 0: 1;
        
        else 
        value = $(this).val();
        
        alert(value);
    );

JSFiddle

【参考方案6】：

因为你没有提到 checkbox 的任何值。试试这个：

<input type="checkbox" class="input" value="1">

演示： http://jsfiddle.net/yDKdT/3/