jQuery jquery获取输入数组字段

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19529443/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 00:10:44  来源:igfitidea点击:

Jquery get input array field

jquery

提问by abiku

I've found similar questions here but nothing works for me.

我在这里找到了类似的问题,但对我没有任何作用。

have inputs like:

有如下输入:

<input type="text" value="2" name="pages_title[1]">
<input type="text" value="1" name="pages_title[2]">

trying to get these fields like:

试图获得这些字段,如:

$('input[name="pages_title[]"]')

but have empty results :(

但结果为空:(

how to get all fields? I can only get it like $('input[name="pages_title[1]"]')

如何获取所有字段?我只能得到它$('input[name="pages_title[1]"]')

回答by 97ldave

Use the starts with selector

使用以选择器开头

$('input[name^="pages_title"]').each(function() {
    alert($(this).val());
});

jsfiddle example

jsfiddle 示例

Note:In agreement with @epascarello that the better solution is to add a class to the elements and reference that class.

注意:与@epascarello 一致认为更好的解决方案是向元素添加一个类并引用该类。

回答by Dementic

this usualy works on Checkboxes and Radio buttons... but, each name should be the same.

这通常适用于复选框和单选按钮......但是,每个名称都应该相同。

<input type="text" value="2" name="pages_title[]">
<input type="text" value="1" name="pages_title[]">

var x = $('input[name="pages_title[]"]').val();

that is "supposed" to get you all the fields in comma separated values. never tried it with text boxes, so cant guarantee it.

那是“应该”让您以逗号分隔值获取所有字段。从来没有用文本框试过,所以不能保证。

as @John commented: to iterate over them. $('input[name="pages_title[]"]').each(function() { var aValue = $(this).val(); });

正如@John 评论的那样:迭代它们。 $('input[name="pages_title[]"]').each(function() { var aValue = $(this).val(); });

EDIT: Not allways you need just to answer the OP questions, sometimes you need to teach them better methods. (sorry if that sounds Arrogant)

编辑:并非总是你只需要回答 OP 问题,有时你需要教他们更好的方法。(对不起,如果这听起来很傲慢)

COMMENT: defining inputs as

评论:将输入定义为

<input type="text" value="1" name="pages_title[1]">
<input type="text" value="2" name="pages_title[2]">

is breaking the array, each input has a unique name, therefor, it is not an array anymore.

正在破坏数组,每个输入都有一个唯一的名称,因此,它不再是数组。

回答by user3021515

use map method we can get input values that stored in array.

使用 map 方法我们可以获得存储在数组中的输入值。

var values = $("input[name='pages_title[]']").map(function(){return $(this).val();}).get();

回答by epascarello

You need to use the starts with selector

您需要使用带有选择器开头

var elems = $( "[name^='pages_title']" );

But a better solution is to add a class to the elements and reference the class. The reason it is a faster look up.

但是更好的解决方案是向元素添加一个类并引用该类。原因是查找速度更快。

回答by Limitless isa

Put the input name between single quotesso that the brackets []are treated as a string

将输入名称放在单引号之间,以便将括号[]视为字符串

var multi_members="";
$("input[name='bayi[]']:checked:enabled").each(function() {
    multi_members=$(this).val()+","+multi_members;
});

回答by Gregory R.

You can give your input textboxes class names, like so:

您可以为输入文本框提供类名称,如下所示:

<input type="text" value="2" name="pages_title[1]" class="pages_title">
<input type="text" value="1" name="pages_title[2]" class="pages_title">

and iterate like so:

并像这样迭代:

$('input.pages_title').each(function() {
    alert($(this).val()); 
});

回答by Thomas Venturini

I think the best way, is to use a Propper Form and to use jQuery.serializeArray.

我认为最好的方法是使用 Propper Form 并使用jQuery.serializeArray

<!-- a form with any type of input -->
<form class="a-form">
    <select name="field[something]">...</select>
    <input type="checkbox" name="field[somethingelse]" ... />
    <input type="radio" name="field[somethingelse2]" ... />
    <input type="text" name="field[somethingelse3]" ... />
</form>

<!-- sample ajax call -->
<script>
$(document).ready(function(){
    $.ajax({
        url: 'submit.php',
        type: 'post',
        data: $('form[name="a-form"]).serializeArray(),
        success: function(response){
            ...
        }
    });
});
</script>

The Values will be available in PHP as $_POST['field'][INDEX].

这些值将在 PHP 中以$_POST['field'][INDEX].

回答by Henry

You can escape the square brackets with double backslashes like this:

您可以像这样使用双反斜杠转义方括号:

$('input[name="pages_title\\[\\]"]')

$('input[name="pages_title\\[\\]"]')

回答by Adnan Ahmad

You may use the contain selector:

您可以使用包含选择器:

[name*=”value”]: selects elements that have the specified attribute with a value containing a given substring.

[name*=”value”]:选择具有包含给定子字符串的值的指定属性的元素。

$( document ).on( "keyup", "input[name*='pages_title']", function() {
     alert($(this).val());
});

回答by gaetanoM

In order to select an element by attribute having a specific characteristic you may create a new selector like in the following snippet using a regex pattern. The usage of regex is intended to make flexible the new selector as much as possible:

为了通过具有特定特征的属性选择元素,您可以使用正则表达式模式创建一个新的选择器,如下面的代码片段所示。regex 的使用旨在使新选择器尽可能灵活:

jQuery.extend(jQuery.expr[':'], {
    nameMatch: function (ele, idx, selector) {
        var rpStr = (selector[3] || '').replace(/^\/(.*)\/$/, '');
        return (new RegExp(rpStr)).test(ele.name);
    }
});


//
// use of selector
//
$('input:nameMatch(/^pages_title\[\d\]$/)').each(function(idx, ele) {
  console.log(ele.outerHTML);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<input type="text" value="2" name="pages_title[1]">
<input type="text" value="1" name="pages_title[2]">
<input type="text" value="1" name="pages_title[]">

Another solution can be based on:

另一种解决方案可以基于:

  • [name^=”value”]: selects elements that have the specified attribute with a value beginning exactly with a given string.

  • .filter(): reduce the set of matched elements to those that match the selector or pass the function's test.

  • [name^=”value”]:选择具有指定属性的元素,该属性的值恰好以给定的字符串开头。

  • .filter():将匹配元素集减少到与选择器匹配或通过函数测试的元素集。

  • a regex pattern
  • 正则表达式模式

var selectedEle = $(':input[name^="pages_title"]').filter(function(idx, ele) {
    //
    // test if the name attribute matches the pattern.....
    //
    return  /^pages_title\[\d\]$/.test(ele.name);
});
selectedEle.each(function(idx, ele) {
    console.log(ele.outerHTML);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<input type="text" value="2" name="pages_title[1]">
<input type="text" value="1" name="pages_title[2]">
<input type="text" value="1" name="pages_title[]">