如何通过Jquery获取具有相同名称但不同索引的所有输入值

Question

我有一个任务，现在有点奇怪，不知道该怎么做。所以，我有一些没有具体数量的输入，它们的名称都是相同的car，但是索引不同，例如sub、master和val。

它看起来像这样：

<input type='text' name='bike[master]' value='some predefined value 1'>
<input type='text' name='bike[sub]' value='some predefined value 2'>
<input type='text' name='bike[val]' value='some predefined value 2.1'>
<input type='text' name='bike[sub]' value='some predefined value 3'>
<input type='text' name='bike[val]' value='some predefined value 3.1'>

我需要，当用户点击输入框后，jQuery将所有这些输入框的值都取出来放到一个变量中，并发送给服务器。如果可能的话，服务器会将这些数据合并在一起并进行处理。

有什么想法吗？对于我来说，索引有点复杂。

- Doctore

---

不太明白您想要的是什么。 - Ranjit Singh

如果您使用 $("form").serialize()，jQuery 将自动为您执行此操作。 - Barmar

Answer 1

当点击时，您可以获取每个输入框的值，其 name 属性以 bike 开头，并将其推入一个数组中。

var result = [];
$('button').click(function() {
  $('input[name^="bike"]').each(function() {
    result.push($(this).val());
  })
  console.log(result)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' name='bike[master]' value='some predefined value 1'>
<input type='text' name='bike[sub]' value='some predefined value 2'>
<input type='text' name='bike[val]' value='some predefined value 2.1'>
<input type='text' name='bike[sub]' value='some predefined value 3'>
<input type='text' name='bike[val]' value='some predefined value 3.1'>
<button>Send</button>

你可以使用 JQuery 的 serializeArray() 函数并返回数组，然后使用该数据。

$('form').click(function() {
  var data = $(this).serializeArray();
  data.forEach((e) => {console.log(e.value)});
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="">
  <input type='text' name='bike[master]' value='some predefined value 1'>
  <input type='text' name='bike[sub]' value='some predefined value 2'>
  <input type='text' name='bike[val]' value='some predefined value 2.1'>
  <input type='text' name='bike[sub]' value='some predefined value 3'>
  <input type='text' name='bike[val]' value='some predefined value 3.1'>
  <input type="submit" value="Send">
</form>

- Nenad Vracar

Answer 2

你可以使用 属性选择器（以某个值开头）。

 $( "input[name^='bike']" );

查看 JSFiddle

- Jenson M John