2009-08-31 4 views
1

HTML:クローン()なしjQueryのclone()で何が失われましたか?

<div id="container"> 
    <select id="selector"> 
     <option value="">--</option> 
     <option value="Service">Service</option> 
     <option value="Sales">Sales</option> 
     <option value="Marketing">Marketing</option> 
     <option value="Finance">Finance</option> 
     <option value="Engineering">Engineering</option> 
     <option value="Management">Management</option> 
    </select> 
</div> 
<input type="button" id="test" /> 

スクリプトは、すべての権利動作します:クローン()と

$('#test').click(function(){ 
    $('#container').find('select').each(function() { 
     var $elem = $(this); 
     var value = $elem.val(); 
     alert(value); 
    }); 
}); 

スクリプトは、動作しません:

$('#test').click(function(){ 
    $('#container').clone().attr('id', 'container2').find('select').each(function() { 
     var $elem = $(this); 
     var value = $elem.val(); 
     alert(value); 
    }); 
}); 
+0

の値を取得できません。試してみてください。 – omg

+0

ボタンをクリックしましたか? – omg

+0

最初に非 - を選択すると、最初のサンプルが選択された値でポップアップされます – omg

答えて

2

私はかどうかを知りませんこれは問題ですが、<select>要素をクローンすると、その選択された項目は、ユーザー。この問題を回避するには、最初に選択したオプションにselected DOMプロパティを適用するだけです。例えば。

$('#test').click(function(){ 

    var selectMenus = $('#container').find('select'); 

    $('#container').clone().attr('id', 'container2').find('select').each(function(i) { 

     /* See this: */ 
     $('option', this)[selectMenus[i].selectedIndex].selected = true; 

     var $elem = $(this); 
     var value = $elem.val(); 
     alert(value); 

    }); 

}); 

編集:私は、これはクロスブラウザの問題であるのかはわからないが、それは確かにFF3.5に影響を与えます。

+0

IE 7でうまく動作します。 – rahul

+0

これは間違いなく良い解決策です。 – omg

関連する問題