Question

我的表单记录了一个JSON数组，其中包括每个输入的名称和值。我试图根据输入类“ optionprix”的相对值为每个输入类“ optionname”添加一个“ optionprix”属性。

我的html表单：

<div id="sortables-form">
<ul id="sortables"><li>
<input name="checkboxes-label" value="Options" type="text">
<ul id="checkboxes">                         
<li>
<input class="optionname" name="checkbox-2778418" value="Option1" optionprix="5" type="text">
<input class="optionprix" name="checkbox-2778418" value="5" type="text">
</li>
<li>
<input class="optionname" name="checkbox-2778419" value="Option2" optionprix="10" type="text">
<input class="optionprix" name="checkbox-2778419" value="10" type="text">
</li>
<li>
<input class="optionname" name="checkbox-2778420" value="Option3" optionprix="15" type="text">
<input class="optionprix" name="checkbox-2778420" value="15" type="text">
</li>
</ul>
<button class="saveButton" data-type="single-checkbox">Save</button>
</li></ul>
</div>

我的javascript函数：

function update_CF_Data(CF_SortablesForm){
    var mySelector = $("sortables-form");
    var data_array = new Array();
    $("#sortables-form :input").not("#sortables-form :input[class=optionprix]").each(function(){

        var item = {};
        item['name'] = $(this).attr('name');
        item['value'] = $(this).attr('value');

        var optionPrix = $("#sortables-form li input[class=optionprix]").val();

        if ($(this).hasClass('optionname')){
        item['optionprix'] = optionPrix;
        }

        data_array.push(item);

    });
    var sortableContent = JSON.stringify(data_array);
    $('#myparentform').val(sortableContent);

    console.log(data_array);
};

JSON记录：

array(6) { [0]=> array(2) { ["name"]=> string(18) "required---2778418" ["value"]=> string(2) "on" } [1]=> array(2) { ["name"]=> string(26) "checkboxes-label" ["value"]=> string(7) "Options" } [2]=> array(3) { ["name"]=> string(25) "checkbox-2778418" ["value"]=> string(7) "Option1" ["optionprix"]=> string(1) "5" } [3]=> array(3) { ["name"]=> string(25) "checkbox-2778419" ["value"]=> string(7) "Option2" ["optionprix"]=> string(1) "5" } [4]=> array(3) { ["name"]=> string(25) "checkbox-2778420" ["value"]=> string(7) "Option3" ["optionprix"]=> string(1) "5" } [5]=> array(0) { } }

实际上，所有记录的数据都采用我的输入类=“ optionprix”的第一条记录，并打印5作为值。

我试图更改我的JavaScript代码以达到我的目标，但没有成功...

也许我与排除部分有关 .not（“＃sortables-form：input [class = optionprix]”）

Answer 1

每次获取对应的$(this)（该迭代的）文本框的值时都没有使用optionprix，则每次获取的值都相同。您可以在JQuery中使用siblings()方法来访问相邻元素的值。

siblings()

尝试一下

function update_CF_Data(CF_SortablesForm){
    var mySelector = $("sortables-form");
    var data_array = new Array();
    $("#sortables-form :input").not("#sortables-form :input[class=optionprix]").each(function(){

        var item = {};
        item['name'] = $(this).attr('name');
        item['value'] = $(this).attr('value');

        //var optionPrix = $("#sortables-form li input[class=optionprix]").val();
        var optionPrix = $(this).siblings("input.optionprix").val();

        if ($(this).hasClass('optionname')){
        item['optionprix'] = optionPrix;
        }

        data_array.push(item);

    });
    var sortableContent = JSON.stringify(data_array);
    $('#myparentform').val(sortableContent);

    console.log(data_array);
};

相对记录循环每个输入并纠正重复记录

1 个答案: