jqueryの第二のクリックが私の意見では

jQuery(document).ready(function($) { 

var $cityToggler=$("#choose-city"); 


function showSelector(){ 
    var $citySelector=$("#city-selector"); 

    if ($citySelector.hasClass("opened")){ 
     $citySelector.slideDown().removeClass("opened"); 
     $cityToggler.addClass("pressed"); 
    } else { 
     $citySelector.slideUp("fast").addClass("opened"); 
     $cityToggler.removeClass("pressed"); 

    } 
} 
$("#choose-city, #close-selector").on("click", function(e){ 
    e.preventDefault(); 
    showSelector(); 
}); 

});

https://jsfiddle.net/fwyukjom/jqueryの第二のクリックが私の意見では

の作品、「都市セレクタは、」リンク「を選択都市」の最初のクリックで開くべきです。しかし、それは2回目のクリックからのみ開き、正常に機能します。（開封済み）

私は間違っていましたか？

出典

2016-08-25 d0ublezer0

オープンクラスは最初のクリックでは存在せず、もう一度クリックすると作成されました。

$(document).ready(function() { 

    $("span:contains(Select city)").on("click",function(){ 

     $(".city-selector").slideToggle(2000); 

    }) 
})

決勝コード：

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <style> 
 
     .city-selector{ 
 
    display:none; 
 
} 
 
    </style> 
 
</head> 
 
<body> 
 
    
 
<div id="city-selector" class="city-selector hide"> 
 
    <div class="container"> 
 
     <div class="row"> 
 
      <a href="#" id="close-selector"> 
 
       <i class="fa fa-times-circle-o"></i> 
 
      </a> 
 
      <p>your city</p> 
 
      <p class="h1">Moscow</p> 
 
     </div> 
 
        
 
    </div> 
 
    </div> 
 
    <div class="row rel"> 
 
     <div class="col-md-offset-8"> 
 
      <a href="#" id="choose-city" class="current-city"> 
 
       <span>Select city</span> 
 
       <i class="fa"></i> 
 
      </a> 
 
     </div> 
 
    </div> 
 
    
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
    <script> 
 
    $(document).ready(function() { 
 

 
     $("span:contains(Select city)").on("click",function(){ 
 

 
      $(".city-selector").slideToggle(2000); 
 

 
     }) 
 
    }) 
 
    </script> 
 
</body> 
 
</html>

出典

2016-08-25 19:29:02 Ehsan

は、なぜ彼はこれを試してみてください

は、次のような簡単な方法を使用することができますか？彼のコードに何が間違っていたのか、それをどのように修正したのかを説明してください。 – Barmar

@Barmar、開いたクラスは最初のクリックでは存在せず、再度クリックすると作成されました。 – Ehsan

解説に解説を入れてください。コメントではありません。 – Barmar

あなたのロジックはちょっと混乱していました。これを試してみてください：

function showSelector(){ 
    var $citySelector=$("#city-selector"); 
     $citySelector.toggleClass('opened'); 

    if ($citySelector.hasClass("opened")){ 
     $citySelector.slideDown(); 
     $cityToggler.addClass("pressed"); 
    } else { 
     $citySelector.slideUp("fast"); 
     $cityToggler.removeClass("pressed"); 

    } 
}

基本的には、openedクラスは、最初のクリックに存在していなかったので、あなたは前に論理ブロックを追加/削除する必要があります。

出典

2016-08-25 19:16:39 Drey

jqueryの第二のクリックが私の意見では

答えて

関連する問題