[英]jquery find all hidden input fields with specific class name
I have a couple of table rows and tables with hidden input fields and values. 我有几个表行和表,其中包含隐藏的输入字段和值。 What i need to do is loop through all the hidden input fields and find a specific field where the class = 'something' and value = something and go up to the
<td>
of that input field and change the background color. 我需要做的是遍历所有隐藏的输入字段并找到一个特定的字段,其中class ='something'和value = something并转到该输入字段的
<td>
并更改背景颜色。
$('input:hidden').each(function(){
if( $(this).find(".id_schedule_hours") && $(this).val() == 1) {
console.log('here')
}
}
.each()
is not necessary; .each()
没有必要; you can use attributes selector, .closest()
你可以使用属性选择器,
.closest()
$("input:hidden[class='something'][value='something']")
.closest("td").css("backgroundColor", /* color */)
to add unique values to be checked against - you could use data attributes and set the desired value to check against in a data variable. 添加要检查的唯一值 - 您可以使用数据属性并设置所需的值以在数据变量中进行检查。 Then in the function - you get the data attribute value (irrespective of the input class) annd compare the value of that desired value:
然后在函数中 - 获取数据属性值(与输入类无关)并比较该期望值的值:
//HTML
<input type="hidden" class="id_schedule_hours" data-desiredvalue="1" name="id_schedule_hours" value="" />
<input type="hidden" class="id_trucks" data-desiredvalue="2" name="id_trucks" value="" />
//js
$('.id_schedule_hours,id_trucks').each(function(){
var desiredValue=$(this).attr('data-desiredvalue');
if( $(this).val() == desiredValue) {
console.log('here');
$(this).parent().css('background-color','red');
}
});
Use the class as a selector and use .parent() to go up the chain and change the parent: 使用该类作为选择器并使用.parent()上升链并更改父级:
$('input[type=hidden].id_schedule_hours').each(function(){
if( $(this).val() == 1) {
console.log('here');
$(this).parent().css('background-color','red');
}
});
Would also suggest changing your selector name - it seems wrong to have a class called .id_... 还建议更改你的选择器名称 - 有一个名为.id _...的类似乎是错误的。
Also - if the only inputs that class are the hidden ones you are interested in, then you can just target them directly in the selector eg: 另外 - 如果该类的唯一输入是您感兴趣的隐藏类,那么您可以直接在选择器中定位它们,例如:
$('.id_schedule_hours').each(function(){
You could leverage the jQuery :hidden selector. 您可以利用jQuery:hidden选择器。 It is not part of the official CSS selectors, but a jQuery selector.
它不是官方CSS选择器的一部分,而是一个jQuery选择器。
$('input.id_schedule_hours:hidden').each(function(){
if( $(this).val() == 1) {
console.log('here')
}
}
Elements with visibility: hidden or opacity: 0 are considered to be visible, since they still consume space in the layout. 具有可见性的元素:隐藏或不透明度:0被认为是可见的,因为它们仍然占用布局中的空间。 During animations that hide an element, the element is considered to be visible until the end of the animation.
在隐藏元素的动画期间,该元素在动画结束前被视为可见。
Elements that are not in a document are not considered to be visible; 不在文档中的元素不被视为可见; jQuery does not have a way to know if they will be visible when appended to a document since it depends on the applicable styles.
jQuery没有办法知道它们在附加到文档时是否可见,因为它取决于适用的样式。
This selector is the opposite of the :visible selector. 此选择器与:visible选择器相反。 So, every element selected by :hidden isn't selected by :visible and vice versa.
因此,选择的每个元素:hidden都不会被选中:可见,反之亦然。
During animations to show an element, the element is considered to be visible at the start of the animation. 在显示元素的动画期间,该元素被视为在动画开始时可见。
How :hidden is determined was changed in jQuery 1.3.2. 如何:隐藏确定在jQuery 1.3.2中被更改。 An element is assumed to be hidden if it or any of its parents consumes no space in the document.
如果元素或其任何父元素在文档中不占用空间,则假定元素被隐藏。 CSS visibility isn't taken into account (therefore $( elem ).css( "visibility", "hidden" ).is( ":hidden" ) == false).
不考虑CSS可见性(因此$(elem).css(“visibility”,“hidden”)。is(“:hidden”)== false)。 The release notes outline the changes in more detail.
发行说明更详细地概述了更改。
jQuery 3 slightly modifies the meaning of :hidden (and therefore of :visible). jQuery 3略微修改了:hidden(因此:可见)的含义。 Starting with this version, elements will be considered :hidden if they don't have any layout boxes.
从此版本开始,将考虑元素:如果它们没有任何布局框,则隐藏元素。 For example, br elements and inline elements with no content will not be selected by the :hidden selector.
例如,:hidden元素和没有内容的内联元素将不会被:hidden选择器选中。
See: jQuery :hidden documentation 请参阅: jQuery:隐藏文档
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.