提交时未通过自定义标签收集数据

Question

我有这种 JS，女巫收集数据并推动它改变。

var dataArray = [];

$(function(){

    $(document).on('change', 'input', function(){

    var hid0 = $(this).data("hidden_val0");

    var hid1 = $(this).data("hidden_val1");

    var hid2 = $(this).data("hidden_val2");

    dataArray.push([hid0, hid1, hid2])

  });

});

   $('.something_here').bind('click', function (event) {

    event.preventDefault();

    $.post('/do/it',

        {

            send_array: dataArray,

        },

        function (response) {

           location.reload();

        }

    );

问题是它看不到目标，我认为？可能是我不应该使用$(this)，因为他根本没有得到正确的价值观。

这是我正在使用的 HTML：

  <input autocomplete="off" id="add_109_01000340001001001_cad" name="add_109_01000340001001001[cad]" hidden_val0="hidden_val0" type="hidden" value="01000340001001001">

  <input autocomplete="off" hidden_val1="hidden_val1" id="add_109_01000340001001001_id" name="add_109_01000340001001001[id]" type="hidden" value="112000666">

  <input autocomplete="off" autocomplete_key="add_109" hidden_val2="hidden_val2" id="add_109_01000340001001001" name="add_109_01000340001001001" onkeyup="fillFlatNumber(this)" size="3" style="height: 10px" type="text" value="1" class="ac_input">

现在我得到了这个，而不是里面的值：

[undefined, undefined, undefined]

如果有人会这么好，可以帮助我。我将感激不尽。

Answer 1

与其使用不同的数据属性，不如使用一个（例如data-hidden），并确保data-为它们添加前缀 of。完成此操作后，您可以使用以下命令遍历所有具有此数据隐藏属性的元素：$("[data-hidden]").each(function() { // loop all tags with `data-hidden`&nbsp; hidden_values.push($(this).data("hidden"));});这里$("[data-hidden]")选择所有具有该data-hidden属性的元素，并.each()允许我们遍历这些元素，其中$(this)指的是我们正在迭代的当前元素。请参见下面的示例：var dataArray = [];$(function() {&nbsp; $('input').change(function() {&nbsp; &nbsp; var hidden_values = [];&nbsp; &nbsp; $("[data-hidden]").each(function() { // loop through all hidden values&nbsp; &nbsp; &nbsp; hidden_values.push($(this).data("hidden"));&nbsp; &nbsp; });&nbsp;&nbsp;&nbsp; &nbsp; dataArray.push(hidden_values);&nbsp; &nbsp; console.log(dataArray);&nbsp; });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script><input autocomplete="off" id="add_109_01000340001001001_cad" name="add_109_01000340001001001[cad]" data-hidden="hidden_val0" type="hidden" value="01000340001001001"><input autocomplete="off" data-hidden="hidden_val1" id="add_109_01000340001001001_id" name="add_109_01000340001001001[id]" type="hidden" value="112000666"><input autocomplete="off" autocomplete_key="add_109" data-hidden="hidden_val2" id="add_109_01000340001001001" name="add_109_01000340001001001" size="3" style="height: 10px" type="text" value="1" class="ac_input">

Answer 2

您的代码存在多个问题，我将尝试一一列出数据属性应以数据为前缀。所以像&nbsp;$(this).data("hidden_val")你的html一样访问应该是&nbsp;data-hidden_val="hidden_val"您正在向所有输入字段添加输入更改事件，因此当您编辑第一个输入时，您无法查询第二个和第三个输入的值，因为它们将为空。如果您尝试获取所有三个元素的值，您的数组将只有一个正确值和两个空值。由于您将数据附加到数组中，因此任何输入的每次更改都会添加一组新的重复值。您为每个输入使用不一致的数据属性，例如hidden_val0等hidden_val1。而只是使用data-hidden_val因此，不要在输入更改时读取数据，而是在将其发送到服务器之前读取它