$（this）内の要素を選択するのに問題がありますが、$（this）outerHTMLでも見ることができます

Question

私はjQuery 1.12を使用しています。私は、最初のリストには、「LI」の要素、次の行を見ることができている

<div class="select" tabindex="1" style="width: 235px;"><select class="selectField selectMenu form-control select-hidden" name="user[address_attributes][state_id]" id="user_address_attributes_state_id" style=""> 
    <option value="">Select State</option> 
    <option value="3526">Alabama</option> 
    <option value="3556">Alaska</option> 
    <option value="3547">Arizona</option> 
    <option value="3510">Arkansas</option> 
    <option value="3542">California</option> 
    <option value="3543">Colorado</option> 
    <option value="3527">Connecticut</option> 
    <option value="3512">Delaware</option> 
    <option value="3513">Florida</option> 
    <option value="3514">Georgia</option> 
    <option value="3555">Hawaii</option> 
    <option value="3548">Idaho</option> 
    <option value="3529">Illinois</option> 
    <option value="3530">Indiana</option> 
    <option value="3528">Iowa</option> 
    <option value="3515">Kansas</option> 
    <option value="3557">Kentucky</option> 
    <option value="3516">Louisiana</option> 
    <option value="3531">Maine</option> 
    <option value="3517">Maryland</option> 
    <option value="3558">Massachusetts</option> 
    <option value="3532">Michigan</option> 
    <option value="3533">Minnesota</option> 
    <option value="3519">Mississippi</option> 
    <option value="3518">Missouri</option> 
    <option value="3549">Montana</option> 
    <option value="3534">Nebraska</option> 
    <option value="3545">Nevada</option> 
    <option value="3535">New Hampshire</option> 
    <option value="3536">New Jersey</option> 
    <option value="3544">New Mexico</option> 
    <option value="3537">New York</option> 
    <option value="3520">North Carolina</option> 
    <option value="3550">North Dakota</option> 
    <option value="3538">Ohio</option> 
    <option value="3521">Oklahoma</option> 
    <option value="3551">Oregon</option> 
    <option value="3559">Pennsylvania</option> 
    <option value="3539">Rhode Island</option> 
    <option value="3522">South Carolina</option> 
    <option value="3552">South Dakota</option> 
    <option value="3523">Tennessee</option> 
    <option value="3524">Texas</option> 
    <option value="3546">Utah</option> 
    <option value="3540">Vermont</option> 
    <option value="3560">Virginia</option> 
    <option value="3553">Washington</option> 
    <option value="3511">Washington, D.C.</option> 
    <option value="3525">West Virginia</option> 
    <option value="3541">Wisconsin</option> 
    <option value="3554">Wyoming</option> 
</select><div class="select-styled active">Select State</div><ul class="select-options" style="display: block;"><li rel="">Select State</li><li rel="3526">Alabama</li><li rel="3556">Alaska</li><li rel="3547">Arizona</li><li rel="3510">Arkansas</li><li rel="3542">California</li><li rel="3543">Colorado</li><li rel="3527">Connecticut</li><li rel="3512">Delaware</li><li rel="3513">Florida</li><li rel="3514">Georgia</li><li rel="3555">Hawaii</li><li rel="3548">Idaho</li><li rel="3529">Illinois</li><li rel="3530">Indiana</li><li rel="3528">Iowa</li><li rel="3515">Kansas</li><li rel="3557">Kentucky</li><li rel="3516">Louisiana</li><li rel="3531">Maine</li><li rel="3517">Maryland</li><li rel="3558">Massachusetts</li><li rel="3532">Michigan</li><li rel="3533">Minnesota</li><li rel="3519">Mississippi</li><li rel="3518">Missouri</li><li rel="3549">Montana</li><li rel="3534">Nebraska</li><li rel="3545">Nevada</li><li rel="3535">New Hampshire</li><li rel="3536">New Jersey</li><li rel="3544">New Mexico</li><li rel="3537">New York</li><li rel="3520">North Carolina</li><li rel="3550">North Dakota</li><li rel="3538">Ohio</li><li rel="3521">Oklahoma</li><li rel="3551">Oregon</li><li rel="3559">Pennsylvania</li><li rel="3539">Rhode Island</li><li rel="3522">South Carolina</li><li rel="3552">South Dakota</li><li rel="3523">Tennessee</li><li rel="3524">Texas</li><li rel="3546">Utah</li><li rel="3540">Vermont</li><li rel="3560">Virginia</li><li rel="3553">Washington</li><li rel="3511">Washington, D.C.</li><li rel="3525">West Virginia</li><li rel="3541">Wisconsin</li><li rel="3554">Wyoming</li></ul></div> 

を出力していても

$(".select").bind('keydown', function(event) { 
    elt = $(this)[0]; 
    console.log(elt.outerHTML); 
    elt = $(this)[0].search("li") 
    console.log(elt.length); 
    switch(event.keyCode){ 
    // case up 
    case 38: 

     break; 
    case 40: 
     break; 
    } 
}); 

を使用して、$（この）内の要素を選択しようとしている

elt = $(this)[0].search("li") 

戻り

TypeError: $(...)[0].search is not a function 

$（this）内の最初の "li"要素を選択するにはどうすればよいですか？ここに問題を示すフィドルがあります - http://jsfiddle.net/cwzjL2uw/14/。

Answer 1

バニラJS（1つの要素のインデックス[0]、outerHTML）とjQueryの奇妙な組み合わせを使用しています。

$(this).find('li:first'); 

Answer 2

あなたがないとき：

$(this)[0] 

それはより多くのjQueryオブジェクトになり、そうでないあなたが使用したい、$(this)以内に最初のliの要素を見つけるために、jQueryのを使用していない

.searchメソッドがあります。 クラスごとに最初の要素を取得したい場合：

elt = $(this).first();