我想使用id获取特定兄弟元素的值,我在运行时构建表单,并且有许多元素具有相同的id但在不同的部分.我试图使用$(this).siblings("#BillNo").val(); $(本).prev( "#BillNo")VAL().但两者都返回未定义的值
这个代码在运行时:佣金
<div id="bill1" class="bill hide withPadding">
<h3>Bill 1</h3>
<span>
<label>Bill no</label>
<input type="text" name="billNo" class="textField" id="BillNo"/>
</span>
<span>
<label>Bill total</label>
<input type="text" name="billTotal" class="textField" id="BillTotal"/>
</span>
<span>
<input type="button" name="addBillDetails" value="Add bill items" id="addBillDetails"/>
</span>
</div>
<div id="bill2" class="bill hide withPadding">
<h3>Bill 2</h3>
<span>
<label>Bill no</label>
<input type="text" name="billNo" class="textField" id="BillNo"/>
</span>
<span>
<label>Bill total</label>
<input type="text" name="billTotal" class="textField" id="BillTotal"/>
</span>
<span>
<input type="button" name="addBillDetails" value="Add bill items" id="addBillDetails"/>
</span>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("input#addBillDetails").live('click',function(){
alert($(this).siblings("#BillNo").val()); …当我点击链接时,我需要找到<section>具有ID属性的下一个并返回其ID.
所以给定以下标记和javascript,我希望点击链接将"section_3"写入控制台.
<section id="section_1">
<a href="#" class="findNext">Find</a>
</section>
<section></section>
<section id="section_3"></section>
<section id="section_4"></section>
和
$('a.findNext').click(function() {
var nextSectionWithId = $(this).closest("section").next("section[id]");
if (nextSectionWithId) {
var sectionId = nextSectionWithId.attr('id');
console.log(sectionId)
}
});
但这不起作用.我在jsFiddle中设置了代码.
任何想法为什么这不起作用？
我有简单的HTML,看起来像这样:
<div class="img">
<a target="_blank" href="kl_big.htm" id="turn-of-cloth-01_lg">
<img src="images/galery/turn-of-cloth-01_lg.jpg" width="110" height="90" />
</a>
<div class="desc">Add a description of the image here</div>
</div>
我有20套这个div与不同的ID,现在href id im gtting与此
$(document).ready(function(){
$('a').click(function (event){
event.preventDefault();
var linkID =$(this).attr("id");
});
});
我不知道什么是img对象id,但我需要得到它的src值.我试着用Jquery这样:
var imgSrcVal = $(this).siblings("img").attr("src");
但是如果没有结果,也可以在click事件中尝试但是没有结果:
imgSrcVal = this.nextSibling.src;
我在这做错了什么？
好吧,我怀疑在我的页面上会有数十个这样的,所以我正在尝试构建一个单独的函数来正确处理它们而不必反复回收代码并更改元素的ID或类名以使其工作.
我的HTML看起来像:
<div class="button_select">
<ul class="button_select_toggle">
<li>
<div class="button_select_text">Menu Text</div><div class="button_select_arrow">V</div>
</li>
</ul>
<ul class="button_select_sub" rel="hidden">
<li>Text</li>
<li>Text</li>
<li>Text</li>
<li>Text</li>
</ul>
</div>
我目前正在尝试做的是使用类button_select_sub专门获得UL,这样我就可以得到它的rel值.在某种程度上这是肯定的,如果这将是任何给定页面上的唯一一个,但是这将在任何给定页面上知道多少次.因此,我试图制作处理它们的通用功能.无论如何,我上次失败的尝试是:
var selectstatus = $(this).siblings('.button_select_sub').attr('rel');
alert('status: '+selectstatus);
但在警报中我得到"状态:未定义"也许我没有正确使用兄弟姐妹？也许是另一种选择.另外值得一提的是button_select_sub可能并不总是div中的最后一个UL,所以我不能这样做:最后一个.
香港专业教育学院也试过,孩子们().找到()..和其他几个人,我知道它可能我不能把它连在一起吧.
如何在悬停列表项时更改其他项的CSS？我的意思是,当我徘徊时,Item 1我希望其他人拥有,让我们说,情人不透明,以产生一个亮点效果.我更喜欢纯粹的CSS,但如果不可能也喜欢jquery.谢谢.
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>
我有几个div由css sprites组成的背景,它们都共享同一个类 - .picture.
当我将鼠标悬停在任何这些div上时,我需要所有其他.picturediv消失,所以基本上只有我在盘旋的div才会保持不褪色.
如果我没有徘徊在这些div上,我需要所有这些都被解散.
到目前为止我试过:
$(function() {
$(".picture").css("opacity","1.0");
$(".picture").hover(function () {
$(this).siblings().stop().animate({opacity: 0.5}, "fast");
},
function () {
$(".picture").stop().animate({opacity: 1.0}, "fast");
});
});
但它不起作用.我怀疑它与这些嵌套的.picturediv干扰.siblings()选择器的方式有关,但无法自己解决:(
这是代码的小提琴 - http://jsfiddle.net/38eqH/1/.
我有以下HTML
<li class="post" style="width: 621px;">
<div class="mediaholder">
<div class="mediaholder_innerwrap overlay cap-icon enlarge">
<a href="#" class="view" data-rel="lightbox" rel="lightbox">
<img width="440" height="330" src="#" class="attachment-portfolio-index wp-post-image">
</a>
</div>
</div>
<div class="detailholder">
<h4 class="post-title"><a href="#">Example Title One</a></h4>
</div>
</div>
</li>
<li class="post" style="width: 621px;">
<div class="mediaholder">
<div class="mediaholder_innerwrap overlay cap-icon enlarge">
<a href="#" class="view" data-rel="lightbox" rel="lightbox">
<img width="440" height="330" src="#" class="attachment-portfolio-index wp-post-image">
</a>
</div>
</div>
<div class="detailholder">
<h4 class="post-title"><a href="#">Example Title Two</a></h4>
</div>
</div>
</li>
我正在尝试使用这个jQuery .post-title在a.view类中移动类li
jQuery(document).ready(function ($) { …我想从我的css选择器中选择嵌套的li
li:first-child {
background-color: rgb(236, 236, 236);
list-style-type: none;
margin-bottom: 3px;
padding: 8px;
}<ul>
<li>to be selected</li>
<li></li>
<li>
<ul>
<li>not to be selected</li>
<li></li>
<li></li>
</ul>
</li>
</ul>预期的 CSS：
.parent > .type1 {
color: red;
}
.parent > .type2 {
color: red;
}
.parent > .type3 {
color: red;
}
原来的少：
.parent {
& > .type1, & > .type2, & > .type3 {
color: red;
}
}
如何组合type1/type2/type3？这不起作用，因为 type2/type3 将被编译为后代，而不是直接子代：
.parent {
& > .type1, .type2, .type3 {
color: red;
}
}
我有一个菜单，我想在悬停时更改链接颜色，但也将其所有同级更改为另一种颜色。没有JS这可能吗？
HTML：
<ul>
<li>
<a>lorem</a>
</li>
<li>
<a>ipsum</a>
</li>
</ul>
社会保障：
ul {
$primary-color: orange;
> li {
> a {
color: #000;
border-bottom: solid 2px transparent;
&:hover {
color: $primary-color;
border-color: $primary-color;
& + a:not(:hover) {
color: red;
}
}
}
}
}