代码之家 › 专栏 › 技术社区 › gurun8

jqueryjson编码输入值集

json jquery

gurun8 · 技术社区 · 14 年前

我可以使用以下方法成功地迭代目标输入:

$("#tr_Features :input").each(function() {
    ...
}

var features = "";
$("#tr_Features :input").each(function() {
    features += {$(this).attr("name"): $(this).val()};
}

序列化整个表单并不能满足我的需要。表单的输入远不止这些。这似乎应该是一个相当简单的任务,但显然编程到周五下午晚些时候不是一件好事。

<table cellspacing="0" border="0" id="TblGrid_list" class="EditTable" cellpading="0">
<tbody><tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Cable Family</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:8" name="feature_id:8"></td>
</tr>
<tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Material</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:9" name="feature_id:9"></td>
</tr>
<tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Thread Size</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:10" name="feature_id:10"></td>
</tr>
<tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Attachment Style</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:11" name="feature_id:11"></td>
</tr>
<tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Feature</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:12" name="feature_id:12"></td>
</tr>
<tr class="FormData" rowpos="1">
    <td class="CaptionTD ui-widget-content">Comments</td>
    <td class="DataTD ui-widget-content" style="white-space: pre;">&nbsp;<input type="text" value="" id="feature_id:13" name="feature_id:13"></td>
</tr>

4 回复 | 直到 14 年前

user113716 14 年前

编辑:

如果我正确理解了您的问题,这将为您提供所需的json对象。

注意,它需要json2库。

var features = {};    // Create empty javascript object

$("#tr_Features :input").each(function() {           // Iterate over inputs
    features[$(this).attr('name')] = $(this).val();  // Add each to features object
});

var json = JSON.stringify(features); // Stringify to create json object (requires json2 library)

感谢R0MANARMY指出了问题中想要的json格式。

有没有理由不使用jQuery的 .serializeArray()

$("#tr_Features :input").serializeArray();

http://api.jquery.com/serializeArray/

.serializeArray()方法创建一个对象的JavaScript数组,可以将其编码为JSON字符串。

<input> , <textarea> ,和 <select>

gurun8 13 年前

显然,我所创造的只是一个漫长而艰难的物体。这听起来比它应该有的更糟,但这是真的。我所需要做的就是使用index/键处的name属性和val()作为值。

var data = new Object();
$("#tr_Features :input").each(function() {
    data[$(this).attr("name")] = $(this).val();
});
return data;

Jason 14 年前

你在试着 += features.push $.each 功能: features[i] = someval

tr 以及你的一些 td 是的。这可能也会引起一些问题。确保您的所有ID都是唯一的。

Joey Adams 14 年前

+= .push() :

var features = new Array();
$("#tr_Features :input").each(function(){
    features.push({$(this).attr("name"): $(this).val()});
});

但是等等,还有更多!据我所知,jQuery不支持将对象转换为JSON字符串(但它支持解析JSON)。为此,需要使用单独的JSON库,例如 this one .