クリックしたときのドロップダウン

Question

私は好奇心が強いです。リンクをクリックすることによってのみ、ドロップダウンが開いたり閉じたりするコードを変更する方法がわかりました。これは、ドロップダウンの本体をクリックすると閉じられて開きます。

$(document).ready(function(){ 
 

 
    $("ul").click(function() { 
 
    $(this).children('li:not(.init)').slideToggle(0); 
 
    $(this).find("li.init").toggleClass("init1"); 
 
    }); 
 

 
});

.selectContainer ul{ 
 
\t width:200px; 
 
} 
 

 
.selectContainer ul li 
 
    { 
 
    border:1px solid green; 
 
    width:100%; 
 
    cursor:pointer; 
 
\t list-style: none; 
 
    } 
 
    
 
.selectContainer ul li:not(.init){ 
 
    display:none; 
 
    float:left; 
 
    } 
 
li.init{position:relative;} 
 
li.init:after{content:"\2193 ";position:absolute;right:5px;} 
 
li.init1:after{content:"\2191 ";position:absolute;right:0;}

<div class="selectContainer"> 
 
      <ul> 
 
       <li class="init">Select</li> 
 
       <li data-value="value 1">Option 1</li> 
 
       <li data-value="value 2">Option 2</li>               
 
      </ul> 
 
    </div>

Answer 1

あなたは試すことができます：

$("ul li.init").click(function(e) { 
    $('li:not(.init)').slideToggle(0); 
    $(this).toggleClass("init1"); 
    }); 

Answer 2

あなたは$("ul")で "UL" -elementを照会し、それがclickだ定義します。明らかにそれの後のすべてのスペースはul-要素の一部です。

代わりに$("li.init").clickを設定しないでください。関数の中で、あなたの例のように "ul"を照会することができます。しかし、 "li"の.clickを設定してください。