0

append メソッドが機能しないコードの何が問題になっていますか? アラートは表示されますが、追加する実際のメソッドが機能していません。以下のコードを参照してください。

jQuery(document).ready(function()
{
    if (!document.getElementById('my_options').value)
    {
        alert('here');
        jQuery('#my_options').append('<span id="option_id_error" class="errors">Error</span>');
    }

});

HTML:

<select id="my_options" name="my_options">
       <option value="">--Select--</option>
       <option value="1">Option 1</option>
       <option value="2">Option 2</option>
       <option value="3">Option 3</option>
       <option value="4">Option 4</option>
</select>
<br/>
<select id="my_options2" name="my_options2">
       <option value="">--Select--</option>
       <option value="1">Option 1</option>
       <option value="2">Option 2</option>
       <option value="3">Option 3</option>
       <option value="4">Option 4</option>
</select>
<br/>
<select id="my_options3" name="my_options3">
       <option value="">--Select--</option>
       <option value="1">Option 1</option>
       <option value="2">Option 2</option>
       <option value="3">Option 3</option>
       <option value="4">Option 4</option>
</select>

フォーム内の選択は動的に生成されます。ドロップダウン ボックスで何も選択されていない場合は、スパン エラー メッセージが表示されます。したがって、私の期待される結果は次のとおりです。

<select id="my_options" name="my_options">
       <option value="">--Select--</option>
       <option value="1">Option 1</option>
       <option value="2">Option 2</option>
       <option value="3">Option 3</option>
       <option value="4">Option 4</option>
</select> <span>Error</span>

オプションに何かを追加する必要はありません。

4

2 に答える 2

1

SELECT アイテム内で SPAN アイテムが有効でないため、あなたがしていることは正しくありません。

たとえば、新しいオプションを追加しようとすると、機能します

$('#my_options').append('<option value="5">item</option>'); 

あなたができることは、以下に示すように選択項目をDIV内にラップすることです

<div id="option1">
    <select id="my_options" name="my_options">
           <option value="">--Select--</option>
           <option value="1">Option 1</option>
           <option value="2">Option 2</option>
           <option value="3">Option 3</option>
           <option value="4">Option 4</option>
    </select>
</div>

あなたができるよりも:

$('#option1').append('<span id="option_id_error" class="errors">Error</span>');

以下のリンクで動作しているのを見ることができます

http://jsfiddle.net/LGkWp/

于 2012-08-29T08:46:29.990 に答える
0

<span>この要素をすぐ隣に追加する必要が<select>ある場合は、.after(..) メソッドを使用できます。

jQuery('#my_options').after('<span id="option_id_error" class="errors">Error</span>');
于 2012-08-29T10:32:32.107 に答える