jquery - 各IDをループして、1つの次元配列と2つの次元配列のオブジェクトの値を取得します

Question

各IDをループして、1つの次元配列と2つの次元配列のオブジェクトの値を取得します

jQueryの新機能..:(

Answer 1

最初に：クラスのIDを変更してから、

$（両方）

にとって：

$(".both") 

等

Answer 2

まず、次のようなHTMLを作成します。

<form id="myform" action="myscript.php" method="get">
    <div>
        <div><textarea name="mytextarea[]"></textarea></div>
        <div><input type="checkbox" name="mycheckboxes1[]"><div>
        <div><input type="checkbox" name="mycheckboxes2[]"><div>
        <div><input type="checkbox" name="mycheckboxes3[]"><div>
    </div>

    <div>
        <div><textarea name="mytextarea[]"></textarea></div>
        <div><input type="checkbox" name="mycheckboxes1[]"><div>
        <div><input type="checkbox" name="mycheckboxes2[]"><div>
        <div><input type="checkbox" name="mycheckboxes3[]"><div>
    </div>

    <div>
        <div><textarea name="mytextarea[]"></textarea></div>
        <div><input type="checkbox" name="mycheckboxes1[]"><div>
        <div><input type="checkbox" name="mycheckboxes2[]"><div>
        <div><input type="checkbox" name="mycheckboxes3[]"><div>
    </div>
</form>

すべてのフォームと同様に、送信されると、クエリ文字列は自動的に作成されname=value、フィールド名とユーザーが入力したデータのペアで構成されます。

または、javascriptで独自のクエリ文字列を作成することもできます。最も簡単な方法は、jQueryの.serialize()：を使用することです。

var data = $("#myform").serialize();

通常、これはAJAXを介してフォームを送信するために行われます。

$.ajax({
    url: 'myscript.php',
    data: $("myform").serialize(),
    type: "GET",
    success: function(data, textStatus, jqXHR) {
        ...
    }.
    error: function(jqXHR, textStatus, errorThrown) {
        ...
    }
});

どちらのタイプの送信でも、[]表記により、各フィールド名がPHP（およびその他のサーバー側言語）で1次元の値の配列として使用できるようになります。たとえば、値の最初のブロックは式で指定されます。

$_GET['mytextarea'][0];
$_GET['mycheckboxes1'][0];
$_GET['mycheckboxes2'][0];
$_GET['mycheckboxes3'][0];

データに関連するアクションは、通常、ループで実行されます。

Answer 3

まず、IDの代わりにクラスを使用します。idはページごとに一意です...ニーズに関して：実際には、次のようなものが必要です。

var data = []
$(document).ready(function(){
    $('.both').each(function(){
        ta = $(this).children('textarea').val();
        cb = $(this).children('input:checked').val()
        data.push({t:ta,c:cb})
    });
    $.each(data, function(index, value){
        $('body').append('<p>t:'+value.t+' c: '+value.c+'</p>');
    })
})

デモはこちら