我无法获得在jquery中单击哪个span类的值。如果条件,则将两个不同的sapn值的值放入。喜欢if(span value == this){} else {} 我需要在jquery函数中使用span值。 这是我的代码:
<div class="two toggle_height">
<h6 style="padding: 0 171px;">Is Active</h6>
<div class="button-wrap button-active">
<div class="button-bg">
<div class="button-out"><span class="out">OFF</span></div>
<div class="button-in"><span>ON</span></div>
<div class="button-switch"></div>
</div>
</div>
</div>
Jquery:
$('.button-wrap').on("click", function(){
$(this).toggleClass('button-active');
});
$('.button-wrap').on("click", function(){
$(this).toggleClass('button-active');
});
&#13;
.two .button-wrap {
width: 113px;
margin: 7px auto 0;
cursor: pointer;
padding: 1px;
}
.two .button-bg {
width: 100%;
background-color: #ddd;
border-radius: 0px;
padding: 2px 0px;
color: #fff;
----------
transition: all 0.2s ease;
}
.two .button-active .button-bg {
background-color: #22dd22;
}
.two .button-switch {
position: relative;
left: 0px;
width: 37px;
height: 16px;
border: solid 5px;
border-radius: 0px;
transition: all 0.2s ease;
margin-top: 1px;
text-align: center;
margin-left: 1px;
}
.two .button-active .button-switch {
left: 62px;
}
.two .button-in,
.two .button-out {
position: absolute;
transition: all 0.2s ease;
padding-top: 4px;
font-size: 0.8em;
text-transform: uppercase;
font-weight: bold;
padding-left: 4px;
}
.two .button-in {
margin-left: 75px;
}
.two .button-out {
margin-left: 18px;
color: #dd2222;
}
.two .button-active .button-out {
color: #fff;
}
.two .button-active .button-in {
color: #22dd22;
}
.two .button-active .button-bg {
background-color: #000;
}
/*.............
btn closed
.............*/
.out{
margin-left: -7px;
}
.all_btns{
/* [disabled]float:right; */
}
.upload_img{
margin-left: -3px;
}
.footer_botm{
margin-bottom: -19px;
}
.footer_botm{
margin-bottom: -19px;
background-color: rgba(232, 219, 219, 0.4);
border-radius: 6px;
}
.choose_efil{
margin-left: 4px !important;
}
element.style {
}
.total_footer.title {
margin-top: 11px;
padding: 5px;
width: 98%;
margin-bottom: -30px;
}
.txt_label{
margin-left: -12px !important;
}
.two {
margin-left: 7px;
margin-top: -29px;
}
.module_toggle{
margin-top: -13px !important;
margin-left: -36px !important;
}
&#13;
<div class="two toggle_height">
<h6 style="padding: 0 171px;">Is Active</h6>
<div class="button-wrap button-active">
<div class="button-bg">
<div class="button-out"><span class="out">OFF</span></div>
<div class="button-in"><span>ON</span></div>
<div class="button-switch"></div>
</div>
</div>
</div>
&#13;
答案 0 :(得分:0)
$(".out").on("click", function()
{
alert( $(".out").html()) // alerts OFF
})
答案 1 :(得分:0)