我有2个div,点击每个div我正在添加课程"任务活动"分别:一旦点击第一个div,正在添加类,然后再次点击另一个div。我正在搜索父div并删除类并添加到当前单击的元素(就像单选按钮一样)。
问题:每当我尝试检查if($(this).parent('').hasClass)
时,它总会返回false
。
HTML :
<div class="full-page-width">
<div class="doctor-wrap clrfix">
<div class="doctor-left">
<div class="doc-img">
<img src="http://i.istockimg.com/image-zoom/84647033/3/380/339/stock-photo-84647033-young-woman-lying-in-the-grass.jpg" alt="doctor select"></div>
<span class="doctor-txt">Tự chọn bác sĩ yêu thích</span>
</div>
<div class="doctor-right">
<div class="doc-img">
<img src="http://i.istockimg.com/image-zoom/84647033/3/380/339/stock-photo-84647033-young-woman-lying-in-the-grass.jpg" alt="doctor select"></div>
<span class="doctor-txt">Giúp chọn <br> bác sĩ phù hợp nhất</span>
</div>
</div>
</div>
Image Courtsey : http://www.istockphoto.com/
JS :
/*--- Doctor List Filter Starts ---*/
$('#search-criteria').keyup(function () {
var searchStr = $(this).val().toUpperCase();
$(".doctor-profile").each(function () {
var isMatch = $(this).text().toUpperCase().indexOf(searchStr) > -1;
$(this)[isMatch ? "show" : "hide"]();
});
});
/*--- Doctor List Filter Ends ---*/
/*--- Mission Page Starts ---*/
console.log('hello');
// Hide all divs on load
$('.select-doctor').hide();
var step1, step2, step2prev, step2next, step3, step4, step5;
step1 = ".btn-1 img, #edit-submit--2";
step2prev = ".doctor-left-btn img";
step2next = ".doctor-right-btn img";
chooseDoctor= ".doctor-left .doc-img";
randomDoctor= ".doctor-right .doc-img";
$(step1).on('click', function(){
$('#fw_content').find('.pane-vietnam-enfa-plus-vietnam-doctor-list-form, .btn-1').fadeOut( "fast" );
$('#fw_content').find('.select-doctor').fadeIn( "fast" );
});
$(step2prev).on('click', function(){
$('#fw_content').find('.pane-vietnam-enfa-plus-vietnam-doctor-list-form, .btn-1').fadeIn( "fast" );
$('#fw_content').find('.select-doctor').fadeOut( "fast" );
});
$(step2next).on('click', function(){
$('#fw_content').find('.doctor-wrap, .doctor-btn-wrap').fadeOut( "fast" );
$('#fw_content').find('#flexslider-1, .pane-vietnam-enfa-plus-vietnam-enfa-plus-form').fadeIn( "fast" );
});
$(chooseDoctor).on('click', function(){
if($(this).parent('.doctor-wrap .doctor-left .doc-img').hasClass('mission-active')){
$(this).removeClass('mission-active');
alert('true 1');
}
else {
$(this).addClass('mission-active');
}
/* else if($(this).parent('.doctor-wrap').find('.doctor-right .doc-img').hasClass('mission-active')){
alert('true 1.1 right');
} */
})
$(randomDoctor).on('click', function(){
if($(this).parent('.doctor-wrap').find('.doctor-left .doc-img').hasClass('mission-active')){
$(this).addClass('mission-active');
alert('RIght Click true 1');
}
else if($(this).parent('.doctor-wrap').find('.doctor-right .doc-img').hasClass('mission-active')){
alert('RIght Click true 1.1 right');
}
})
/*--- Mission Page Ends ---*/
答案 0 :(得分:1)
问题是.parent(“。doctor-wrap”)
你必须做.parent s (“。doctor-wrap”)
但是,你可以这样做:
https://jsfiddle.net/bcnppybm/2/
$('.doc-img').click(function() {
$('.doc-img').each(function(){$(this).removeClass('mission-active');});
if (!$(this).hasClass('mission-active')) {
$(this).addClass('mission-active');
}
})