[英]Using jQuery to save the name of each div that has a specific class to a variable
I need to loop through a list of divs. 我需要遍历一个div列表。 If a div in that list has the class name of "active", than I need to save the contents of the
<p></p>
tag of the specific div to a variable. 如果该列表中的div具有类名“active”,则需要将特定div的
<p></p>
标记的内容保存到变量中。 I then need to place the contents of that variable in a the value of a hidden input element on a form. 然后,我需要将该变量的内容放在表单上隐藏的输入元素的值中。 For example, here is some example HTML:
例如,这是一些HTML示例:
<div class="names">
<div class="one active">
<p>A</p>
</div>
<div class="two active">
<p>B</p>
</div>
<div class="three">
<p>C</p>
</div>
<div class="four active">
<p>D</p>
</div>
<div class="five">
<p>E</p>
</div>
<div class="six active">
<p>F</p>
</div>
</div>
<form action="form.php" method="POST">
<input type="hidden" name="list" id="list" value="">
</form>
Since four of the divs contain the "active" class, I need to save the content that is in each paragraph tag to a variable to be inserted into the value of the hidden field. 由于四个div包含“活动”类,我需要将每个段落标记中的内容保存到要插入隐藏字段值的变量中。 In this example, the value of the field would be A, B, D, F.
在此示例中,字段的值将为A,B,D,F。
I thought about doing something like this: 我想过做这样的事情:
var userSelection = function() {
$('.names div').each(function () {
if($(this).hasClass('active')) {
return $(this).text();
}
});
};
$('#list').val(userSelection);
First off, that code doesn't work and I am also not even sure if that's the best way to go about solving my problem. 首先,该代码不起作用,我甚至不确定这是否是解决问题的最佳方法。 Second, if anyone has a better idea of how to accomplish what I need, I would love to hear it.
其次,如果有人对如何完成我需要的东西有了更好的了解,我很乐意听到它。
I would use map()
to get an array of the text: 我会使用
map()
来获取文本数组:
var textArr = $('.names div.active').map(function() {
return $(this).text();
}).get();
From there, you could use join()
to get a string you could write to the DOM: 从那里,您可以使用
join()
来获取可以写入DOM的字符串:
var textString = textArr.join(', ');
Full, compressed code: 完整的压缩代码:
var userSelection = function() {
return $('.names div.active').map(function() {
return $(this).text();
}).get().join(', ');
};
$('#list').val(userSelection());
Alternative to Jason P's answer is to modify what you've got to return an array of the results, as you're calling a function into a variable that has multiple results: 替代Jason P的答案是修改你必须返回结果数组的内容,因为你将一个函数调用到一个具有多个结果的变量中:
var userSelection = function() {
var output = [];
$('.names div').each(function () {
if($(this).hasClass('active')) {
output.push( $(this).text().trim() );
}
});
return output;
};
Working fiddle: http://jsbin.com/uQEJIkU/3/edit 工作小提琴: http : //jsbin.com/uQEJIkU/3/edit
$(document).ready(function() {
values = []
$("div.active > p").each( function() {
values.push($(this).text())
})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.