0

我有一个包含 n 个 div 的表单,每个 div 包含单独的输入。这些 div 存在于相同的类名“c1”下,但不包含任何其他属性。每个 c1 包含具有唯一类名的相同输入。每个 div 将始终包含相同样式的输入。这方面的一个例子是:

<div class="c1">
    <input class="in1" type="text"/>
    <input class="in2" type="text"/>
</div>
<div class="c1">
    <input class="in1" type="text"/>
    <input class="in2" type="text"/>
</div>
<div class="c1">
    <input class="in1" type="text"/>
    <input class="in2" type="text"/>
</div>

信息应该通过使用 jQuery 的 $.post(...) 的帖子发送。我不使用 id 系统让用户能够修改内容,即添加和删除 c1 div。我不知道如何将收集到的信息发布到一个 php 页面以获取 n 数量的项目,也不知道如何根据 div 将信息保存在一起。有什么建议吗?

我一直在考虑使用序列化,但我不确定如何根据封装的 div 保持信息的唯一性。map另一种方法是使用命令迭代每个 div 为帖子的“数据”参数进行自定义.each,但有些东西告诉我我走错了路。

4

3 回答 3

1

你可以做这样的事情来自动生成命名参数:

    var postData = {};
    $(".c1").each(function() {
        var name = "input" + $(this).index();

        postData[name + "in1"] = $(this).find(".in1").val();
        postData[name + "in2"] = $(this).find(".in2").val()       
    })

    console.log(postData);

然后只需通过 AJAX 提交 postData

​</p>

于 2012-04-24T20:24:38.710 回答
0

如果您动态生成它,您可以为每个输入设置一个唯一的 id。如inp1、inp2等。然后您可以根据这些唯一 ID 创建您的地图。

于 2012-04-24T20:04:51.640 回答
0

如果您严格遵守您的 HTML 代码,那么您无法自动执行任何操作,例如使用.serialize()jQuery 中的方法,因为它至少name需要使用 。

手动执行此操作,您可以创建数据,然后将其发布如下:

$("#btnSave").click(function() {

var dt = {},
    div = 0,
    arr = 0;

$(".c1").each(function() {
  // for each <div class="c1">
  $(this).find("input").each(function() {
    // for each <input> inside the <div>

    dt['p' + arr++] = 'd' + div + 
            '_c_' + $(this).attr("class") + 
            '_v_' + $(this).val();
  });
  div++;
});

// now, we post the data    
$.post("http://bing.com/", dt, function(data) {
  // do something...
});

return false; // dont post automatically

});

然后你有类似的东西:

p0  _d_0_c_in1_v_1
p1  _d_0_c_in2_v_4
p2  _d_1_c_in1_v_2
p3  _d_1_c_in2_v_5
p4  _d_2_c_in1_v_3
p5  _d_2_c_in2_v_6

并且d2_c_in2_v_6您可以将字符串拆分为:

  • _d_对于 div
  • _c_对于类名
  • _v_对于输入值

JsBin 中的实例

于 2012-04-24T20:42:51.680 回答