如何檢查懸停功能中的2個條件

Question

我有一個問答頁面，詢問一個問題，用戶將檢查3個合適的複選框作爲他或她的答案（從6個複選框列表中）。然後，用戶通過懸停在答案按鈕上（'＃check-answer-btn'）來檢查他/她的答案。

如果用戶將鼠標懸停在$('#check-answer-btn')上且選中的複選框少於3個，我想要某個提醒$('.alert-box2')淡入。

所以我的問題是，我可以有一個懸停函數內的兩個條件？我發佈了我嘗試過的代碼無濟於事。有人可以幫我找到解決方案嗎？謝謝。

 $('#check-answer-btn').hover(function(e){ 
      var checkboxes = $('.chbx-25b input[type="checkbox"]:checked').length; 
      if (checkboxes < 3) { 
       $('.alert-box2').fadeIn(200); 

      }, $('.alert-box2').stop().fadeOut(200); 

      else if (checkboxes >= 3) { 
       $('#checkbox-fadebox').fadeIn(200); 
      }, $('#checkbox-fadebox').stop().fadeOut(200); 
     ); 

我認爲HTML可能是太多，但在這裏它是：

<p style="width:675px; margin:15px 0 20px 0;">Please choose the best answer for each of the following questions. <br>After you've selected your answer, roll over the <span class="bold">Check Answer</span> button.</p> 

     <div class="quiz-25a question1 inline vertical" style="margin:15px 0 0 0;"> 

      <p class="bold float-left">1.</p><span class="bold float-left" style=" width:640px; margin:0 0 10px 10px;">Indicators are why the claim rep referred this questionable claim to you as an investigator.</span> 
      <div class="clear"></div> 

      <input id="quiz-25a-1a" type="radio" name="quiz-25a-1a" value="a"><p class="float-left" style="margin:0 12px;">a.</p><span>True</span> 
      <div class="clear"></div> 

      <input id="quiz-25a-1b" type="radio" name="quiz-25a-1b" value="b"><p class="float-left" style="margin:0 12px;">b.</p><span>False</span> 

      <div class="clear"></div> 

      <button id="answer-btn1" class="answer-btn"></button> 

     </div><!-- end quiz-25a question1 inline vertical --> 





     <form class="chbx-25a inline vertical" style="margin:15px 0 0 0;"> 

     <p class="bold float-left">2.</p><span class="bold float-left" style=" width:640px; margin:0 0 10px 10px;">Identify 3 reasons included in the following list that are reasons for creating a vehicle theft insurance fraud scheme.</span> 
      <div class="clear"></div> 

      <label for="chbx-25a-2-1"><input id="chbx-25a-2-1" type="checkbox"><span class="bold float-left">A.</span><span>There is no work number for either Bob or Jane Field’s in the claim file.</span></label> 
      <label for="chbx-25a-2-2"><input id="chbx-25a-2-2" type="checkbox"><span class="bold float-left">B.</span><span>The vehicle had 8400 miles on it at the time of the theft.</span></label> 
      <label for="chbx-25a-2-3"><input id="chbx-25a-2-3" type="checkbox"><span class="bold float-left">C.</span><span>The theft happened in the middle of the day, downtown with no witnesses.</span></label> 
      <label for="chbx-25a-2-4"><input id="chbx-25a-2-4" type="checkbox"><span class="bold float-left">D.</span><span>Mrs. Fields parked the car one door down from Betty’s.</span></label> 
      <label for="chbx-25a-2-5"><input id="chbx-25a-2-5" type="checkbox"><span class="bold float-left">E.</span><span>The vehicle had a premium sound system.</span></label> 
      <label for="chbx-25a-2-6"><input id="chbx-25a-2-6" type="checkbox"><span class="bold float-left">F.</span><span>The vehicle had an anti-theft alarm that no one heard.</span></label> 

     </form><!-- end chbx-25a inline vertical --> 

     <button id="check-answer-btn" class="check-answers-btn"></button> 

     <p style="margin-top:15px;">Click NEXT to continue.</p> 

     <div id="answer1" class="fade-box absolute" style="width:340px; height:105px; top:150px; left:270px;"> 
      <p class="answer-title bold">The correct answer is a, true.</p> 
      <p class="font-size14">Indicators of a questionable claim are inconsistencies in a claimant’s story, they don’t make sense in the over-all big picture. As these indicators mount up, it becomes more important to investigate the claim.</p> 
     </div><!-- end answer1 --> 


     <div id="checkbox-fadebox" class="fade-box absolute" style="text-align:center; width:410px; height:470px; top:65px; left:235px;"> 

      <p class="bold italic" style="font-size:16rpx; margin-top:5px;">The following indicators of vehicle theft insurance fraud apply to this case.</p> 

      <img src="img/25b-chbx-ans.gif" alt="" style="margin:12px 0 0 0;"/> 

     </div><!-- end checkbox-fadebox --> 

     <div class="alert-box absolute"> 

      <p>Please select the best answer(s)<br> for <span style="text-decoration:underline;">each</span> of the following questions.</p> 

      <img class="OK-btn absolute pointer" style="display:block; bottom:6px; right:6px;" src="img/OK-btn.gif" /> 

     </div> 

     <div class="alert-box2 absolute"> 

      <p>Please identify 3 reasons for creating a vehicle theft insurance fraud scheme.</p> 

     </div> 

Answer 1

我發現我的答案在我自己的語法錯誤，發現並打破了條件句成兩個獨立的。我意識到，我分配給我的變量「複選框」的值與我在HTML（.chbx-25b和.chbx-25a）中找到的值不同。另外，在每個「ifs」之後使用的第一個大括號不正確。我已經發布了以下成功的代碼塊。感謝所有嘗試提供幫助的人！

 $('#check-answer-btn').hover(function(){ 
      var checkboxes = $('.chbx-25b input[type="checkbox"]:checked').length; 

      if(checkboxes === 3) 
       $('#checkbox-fadebox').fadeIn(); 
      }, function(){ 
       $('#checkbox-fadebox').stop().fadeOut(); 
     }); 

     $('#check-answer-btn').hover(function(){ 
      var checkboxes = $('.chbx-25b input[type="checkbox"]:checked').length; 

      if(checkboxes!== 3) 
       $('.alert-box25b').fadeIn(); 
      }, function(){ 
       $('.alert-box25b').stop().fadeOut(); 
     });