選択要素のランダムな位置にオプションを追加しますか？

Question

<select> 

     <option>One</option> 

     <option>Two</option> 

    </select> 

私はJavaScriptを使用して第一及び第二のoptionの間で新しいoptionを追加したいと思います。

必要な結果：セレクタが示されている前に要素を追加します

$('<option> New </option>').insertBefore('select option:nth-child(2)'); 

insertBefore：

<select> 

    <option> One </option> 

    <option> New </option> 

    <option> Two </option> 

</select> 

Answer 1

これを試してみてください。この場合、私たちの選択の第2子optionを選択します。 nth-childはゼロベースのインデックスではないことに注意してください。

JSFiddle：jQueryのでhttps://jsfiddle.net/58209tgu/

Answer 2

、あなたは機能をinsertAfter使用することができます。

ドキュメント：

http://api.jquery.com/insertafter/

例HTML：

<select> 
    <option id='insertAfterMe'>One</option> 
    <option>Two</option> 
</select> 

例のjQuery：

$(function(){ 
    $('<option>new option</option>').insertAfter('#insertAfterMe'); 
}); 

jsFiddle：

https://jsfiddle.net/fx7xxhvq/

あなたが後に挿入する要素にIDを入れたくない場合は、任意の有効なセレクタは、そのような中で言及したn番目の子のセレクタとして動作します他の答え。

Answer 3

使用eq(index)

$('<option />').text('New').insertAfter('select option:eq(0)');