Javascript 使用jQuery自动获取div内所有元素的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8588368/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Automatically get values of all element inside a div with jQuery
提问by Danilo
I have a main div and inside of this, there are a lot of input text and radio button.
Like this:
我有一个主 div，里面有很多输入文本和单选按钮。
像这样：
<div id="mainDiv">
<input type="text" name="text-1" /> <br/>
<input type="radio" name="radio-1" />Yes
<input type="radio" name="radio-1" />No <br/>
<input type="text" name="text-2" /> <br/>
<input type="text" name="text-3" /> <br/>
</div>
<img src="img/img.gif" onclick="getAllValues();" />
I want to define the function getAllValues()in jQuery to get all values in mainDivand save them in a string.
It is possible?
我想getAllValues()在 jQuery 中定义函数以获取所有值mainDiv并将它们保存在一个字符串中。
有可能的？
回答by Rory McCrossan
To achieve this you can select all the form fields and use map()to create an array from their values, which can be retrieved based on their type. Try this:
为了实现这一点，您可以选择所有表单字段并使用map()它们的值创建一个数组，可以根据它们的type. 尝试这个：
function getAllValues() {
var inputValues = $('#mainDiv :input').map(function() {
var type = $(this).prop("type");
// checked radios/checkboxes
if ((type == "checkbox" || type == "radio") && this.checked) {
return $(this).val();
}
// all other fields, except buttons
else if (type != "button" && type != "submit") {
return $(this).val();
}
})
return inputValues.join(',');
}
The ifstatement could be joined together here, but I left them separate for clarity.
该if声明可以在这里合并在一起，但为了清楚起见，我将它们分开了。
回答by dfg
Try something like that:
尝试这样的事情：
function getAllValues() {
var allVal = '';
$("#mainDiv > input").each(function() {
allVal += '&' + $(this).attr('name') + '=' + $(this).val();
});
alert(allVal);
}
回答by Minko Gechev
Here is solution which is building you a JSON string. It's getting the values of the text fields, check boxes and select elements:
这是为您构建 JSON 字符串的解决方案。它获取文本字段、复选框和选择元素的值：
function buildRequestStringData(form) {
var select = form.find('select'),
input = form.find('input'),
requestString = '{';
for (var i = 0; i < select.length; i++) {
requestString += '"' + $(select[i]).attr('name') + '": "' +$(select[i]).val() + '",';
}
if (select.length > 0) {
requestString = requestString.substring(0, requestString.length - 1);
}
for (var i = 0; i < input.length; i++) {
if ($(input[i]).attr('type') !== 'checkbox') {
requestString += '"' + $(input[i]).attr('name') + '":"' + $(input[i]).val() + '",';
} else {
if ($(input[i]).attr('checked')) {
requestString += '"' + $(input[i]).attr('name') +'":"' + $(input[i]).val() +'",';
}
}
}
if (input.length > 0) {
requestString = requestString.substring(0, requestString.length - 1);
}
requestString += '}';
return requestString;
}
You can call the function like this:
你可以这样调用函数：
buildRequestStringData($('#mainDiv'))
And the result http://jsfiddle.net/p7hbT/
