hasClass jQuery总是给出“假”(hasClass jQuery always gives “false”)

更新了DEMO链接

我有两个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 ---*/

Updated DEMO Link

I have 2 divs, on click of each div I'am adding class "mission-active" respectively: once first div is clicked class is being added, then again I'am clicking the other div. I am searching the parent div and removing class and adding to current clicked element (just like Radio Button).

Issue : Whenever I try to check if($(this).parent('').hasClass), it always returns 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 ---*/

最满意答案

问题是.parent（“。doctor-wrap”）

你必须做.parent s （“。docI-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'); } })

The problem is .parent(".doctor-wrap")

You must do .parents(".doctor-wrap")

But, you can do like this :

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'); } })

更多推荐

class,div,parent,---,电脑培训,计算机培训,IT培训"/> <meta name="descript