javascript - 来自 javascript 的 json 记录,espace 空记录

标签 javascript html arrays json forms

我希望将输入记录到 JSON 数组中的表单中,但我不知道为什么它会用“{}”记录空项目,当我想在以后使用它时,这会导致我的视​​图表单出现错误。

我的 JavaScript 代码:

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

        var optionPrix = $(this).siblings("input.optionprix").val();
        var item = {};
        item['name'] = $(this).attr('name');
        item['value'] = $(this).attr('value');

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

        data_array.push(item);

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

};

html 表单:

<form id="cf-sortables-form">
<ul>
    <li class="ui-state-default">
    <small>Radio Buttons</small>
    <p><input class="cf-required-checkbox" checked="checked" type="checkbox" name="required---4969523" id="required---4969523"> <label for="required---4969523">Champs Obligatoire</label></p>
    <input type="text" name="radio-buttons-label---4969523___required" value="Utilisateurs :">
        <ul id="cf-radio-buttons" class="ui-sortable">
        <li class="ui-state-default">
            <input type="text" class="optionname" name="single-radio-button---4969523" value="1 ou 2">
            <img src="images/icon-euro.png" alt="Prix" width="16" height="16">
            <input type="text" class="optionprix" name="single-radio-button---4969523" value="0">
            </li>
        </ul>
    <button class="cfButton button" data-type="single-radio-button"><i class="booked-icon booked-icon-plus"></i>&nbsp;&nbsp;Radio Button</button>
    </li>
    <li class="ui-state-default">
    <small>Checkboxes</small>
    <p><input class="cf-required-checkbox" checked="checked" type="checkbox" name="required---8940009" id="required---8940009"> <label for="required---8940009">Champs Obligatoire</label></p>
    <input type="text" name="checkboxes-label---8940009___required" value="Options Payantes :">
        <ul id="cf-checkboxes" class="ui-sortable">                         
            <li class="ui-state-default">
            <input type="text" class="optionname" name="single-checkbox---8940009" value="Option 1" optionprix="5">
            <img src="images/icon-euro.png" alt="Prix" width="16" height="16">
            <input type="text" class="optionprix" name="single-checkbox---8940009" value="5">
            </li>                         
        </ul>
    <button class="cfButton button" data-type="single-checkbox"><i class="booked-icon booked-icon-plus"></i>&nbsp;&nbsp;Checkbox</button>
    </li>
    <li class="ui-state-default">
    <small>Paragraphe de texte</small>
    <p><input class="cf-required-checkbox" checked="checked" type="checkbox" name="required---6402519" id="required---6402519"> <label for="required---6402519">Champs Obligatoire</label></p>
    <input type="text" name="paragraph-text-label---6402519___required" value="Remarque éventuelle :">
    </li>
</ul>
</form>

JSON 记录数组:

[{\"name\":\"required---4969523\",\"value\":\"on\"},{\"name\":\"radio-buttons-label---4969523___required\",\"value\":\"Utilisateurs :\"},{\"name\":\"single-radio-button---4969523\",\"value\":\"1 ou 2\",\"optionprix\":\"0\"},{},{\"name\":\"required---8940009\",\"value\":\"on\"},{\"name\":\"checkboxes-label---8940009___required\",\"value\":\"Options Payantes :\"},{\"name\":\"single-checkbox---8940009\",\"value\":\"Option 1\",\"optionprix\":\"5\"},{},{\"name\":\"required---6402519\",\"value\":\"on\"},{\"name\":\"paragraph-text-label---6402519___required\",\"value\":\"Remarque éventuelle :\"}]

我通过分析表单中的每个输入进行搜索,但我仍然不知道为什么它记录空数组。

如果 item 等于 {},也许我可以找到一种方法来分隔/避免记录?

最佳答案

发现我的问题来自“按钮”后问题已解决。

我不知道为什么,但是 JavaScript 将每个“按钮”记录为空对象,所以我只是在 jquery 上添加了一个新的 .not 条件来过滤“按钮”,就可以了。

$("#cf-sortables-form :input").not("#cf-sortables-form :input[class=optionprix]").not("#cf-sortables-form :button").each(function(){

你可以检查这个jsfiddle => http://jsfiddle.net/q8gwcor0/

关于javascript - 来自 javascript 的 json 记录,espace 空记录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53171575/

相关文章:

javascript - 有什么办法可以避免 Canvas 中的跨域图像问题?

javascript - 重复的可扩展图像网格失去功能

php - 如何在div中回显php变量

c++ - 如何在C++中获得二维数组中一列的最低数目?

c# - 同一链接在页面中重复多次单击其中一个会更改所有相同链接的颜色

javascript - 从 ZeroMQ 回调调用时,Meteor 插入/删除操作会引发异常

javascript - 如何避免 DEADLINE_EXCEEDED 时 "We' 抱歉,发生服务器错误。请稍等,然后重试。”会发生什么?

javascript - 链接index.html client.js 和 server.js

ios - Swift:从解析中检索数据编号并计算平均值

java - 更改每个列表元素的 ArrayList<?> 标记