webentwicklung-frage-antwort-db.com.de

Auswahlfeld für JQuery-Aktualisierung

Ich fülle ein Auswahlfeld mit JQuery beim Laden der Seite mit dieser Methode aus 

 $('#select').append('<option value="' + result + '">' + result + '</option>');

Das Auswahlfeld bleibt jedoch leer, d. H. Der erste Wert in der Optionsliste ist nicht als ausgewählte Option ausgewählt. 

Wie kann ich diese Liste "aktualisieren", damit der erste Wert vorgewählt wird?

Entschuldigung - hätte gesagt, es war früher JQuery Mobile

Vielen Dank.

jqueryselectjquery-mobileoption
11
user1202278

Sie können dem Optionselement, das Sie auswählen möchten, ein "ausgewähltes" Attribut hinzufügen:

$('#select')
    .append('<option value="' + result + '" selected="selected">' + result + '</option>');

Sie geben nicht an, wie Sie das Element genau ausfüllen. Verwenden Sie dazu eine Schleife. Sie könnten dies wie folgt tun:

var data = ['a', 'b', 'c'];
var $select = $('#select'); // you might wanna empty it first with .empty()

for (var i = 0; i < data.length; i++) {
    var o = $('<option/>', { value: data[i] })
        .text(data[i])
        .prop('selected', i == 0);
    o.appendTo($select);
}​

DEMO

Es scheint also, dass Sie jQuery Mobile verwenden, wie Sie es in dem Kommentar gesagt haben.

Wenn Sie das selectmenu widget verwenden, müssen Sie programmgesteuert aktualisieren, nachdem Sie den Inhalt/die Struktur programmgesteuert geändert haben:

$select.selectmenu("refresh", true);

Dokumentation

21
Didier Ghys

Sie können verwenden

$('#select').removeAttr('selected').find('option:first').attr('selected', 'selected');
4
Mohora Bogdan

Sie legen einfach den gewünschten Wert fest, d. H. $('#select').val(5); .. also in Ihrem Fall $('#select').val(result);

Bearbeiten: ein vollständiges Arbeitsbeispiel enthalten: 

<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.4.js'></script>
<select id='select'></select>
<br>
<input type=button onclick='addNew()' value='Add'>

<script>
function addNew()
{
        var result = Math.floor(Math.random()*1000);
        $('#select').append('<option value="' + result + '">' + result + '</option>'); 
        $('#select').val(result);           
} 
</script>

Das

3
Ashraf

Nicht alle Browser werden automatisch aktualisiert, nachdem Sie eine neue Option hinzugefügt haben.

Ein Trick, der für mich funktioniert, besteht darin, die Auswahlbox auszublenden und anzuzeigen, nachdem Sie neue Optionen hinzugefügt haben. Also in deinem Fall:

 $('#select').append('<option value="' + result + '">' + result + '</option>').hide().show();

Um die richtige neu hinzugefügte Option auszuwählen, folgen Sie diesen Anweisungen:

 $('select').val(result);
1
gintas

Hallo, nach mehreren Recherchen habe ich mit diesem Teil des Codes gelöst:

$('#select_id').empty();    
$('#select_id').append($('<option>',{text: 'pippo', value: 'pippo', selected: true}))
$('#select_id').change();

Ich hoffe es hilft.

0
marfing

Die Antwort von Mohora Bogdan funktioniert nur einmal, wenn Sie eine andere Option auswählen, funktioniert sie nicht mehr. 

Um es wiederverwendbar zu machen, verwenden Sie:

$('#select').prop('selected', false).find('option:first').prop('selected', true);
0
Hooman