Question

$('.cinput').each(function(){
console.log($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='radiox' class='cinput' value='black' checked>
<input type='radio' name='radiox' class='cinput' value='white'>
<input type='text' class='cinput' value='gold'>
<textarea class='cinput'>silver</textarea>

我知道通过这种方式获得无线电价值：

var radio = $("input[type='radio'][name='radiox']:checked").val();

但是有一种方法可以与其他所有输入一起获得：

$('.cinput').each(function(){
console.log($(this).val());
});

我需要结果：black gold silver，而不是black white gold silver

Answer 1

您可以像这样单独选择类型：

$(':text.cinput, textarea.cinput, :radio.cinput:checked').each(function() {
  console.log($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='radiox' class='cinput' value='black' checked>
<input type='radio' name='radiox' class='cinput' value='white'>
<input type='text' class='cinput' value='gold'>
<textarea class='cinput'>silver</textarea>

Answer 2

您可以这样操作-如果（通过类选择器）在输入字段上循环的输入字段是一个单选按钮，并且未选中，请在不进行console.log ging的情况下从循环返回。

$(".cinput").each(function() {
  if ($(this).attr("type") === "radio" && !$(this).attr("checked")) return;
  console.log($(this).val());
});

Answer 3

您应该将元素放入表格中。然后，您可以使用HTMLFormElement#elements轻松获得所有值。只需确保为每个字段命名即可。

const form = document.querySelector('form')
const elements = form.elements

const value = {
  radiox: elements.radiox.value,
  color: elements.color.value,
  details: elements.details.value,
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form>
  <input type='radio' name='radiox' value='black' checked>
  <input type='radio' name='radiox' value='white'>
  <input type='text' name="color" value='gold'>
  <textarea name="details">silver</textarea>
</form>

您甚至不需要上课。当然，如果您需要其他功能，可以将其保留在此处，但为了使示例更小，我将其删除。

Answer 4

另一种选择是filter由不是单选按钮或被选中的人cinput（因此不包括未选中的单选按钮）：

$('.cinput').filter((_, { type, checked }) => type !== 'radio' || checked).each(function() {
  console.log($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='radiox' class='cinput' value='black' checked>
<input type='radio' name='radiox' class='cinput' value='white'>
<input type='text' class='cinput' value='gold'>
<textarea class='cinput'>silver</textarea>

Answer 5

您可以执行以下操作：

var s = $('.cinput').map(function() {
  if ($(this).is(":checked") || $(this).is(":not([type=radio])")) {
    return $(this).val();
  }
}).get();

演示

var s = $('.cinput').map(function() {
  if ($(this).is(":checked") || $(this).is(":not([type=radio])")) {
    return $(this).val();
  }
}).get();
console.log(s)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='radiox' class='cinput' value='black' checked>
<input type='radio' name='radiox' class='cinput' value='white'>
<input type='text' class='cinput' value='gold'>
<textarea class='cinput'>silver</textarea>

Answer 6

如果表单控件是固定的，则可以执行以下操作

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='radiox' class='cinput' value='black' checked>Black
<input type='radio' name='radiox' class='cinput' value='white'>White
<input type='text' class='cinput' value='gold'>
<textarea class='cinput'>silver</textarea>

{{1}}

获得无线电值以及所有其他输入

6 个答案: