Wie fülle ich kaskadierende Dropdown-Listen mit jQuery für eine verbesserte Browserkompatibilität?

Kaskadierende Dropdown-Listen mit jQuery füllen

Hintergrund

Sie sind auf eine Herausforderung gestoßen, als Sie versucht haben, ein Formular mit dynamischen kaskadierenden Dropdown-Listen sowohl in HTML als auch in HTML zu erstellen JavaScript. Ihr ursprünglicher JavaScript-Code funktionierte, es traten jedoch Kompatibilitätsprobleme im Internet Explorer auf. Aus diesem Grund möchten Sie auf jQuery umsteigen, um die Kompatibilität zu verbessern.

Die Lösung

Die Lösung für Ihr Problem ist überraschend einfach:

<br> jQuery(function($) {</p>
<pre class="brush:php;toolbar:false">var locations = {
    'Germany': ['Duesseldorf', 'Leinfelden-Echterdingen', 'Eschborn'],
    'Spain': ['Barcelona'],
    'Hungary': ['Pecs'],
    'USA': ['Downers Grove'],
    'Mexico': ['Puebla'],
    'South Africa': ['Midrand'],
    'China': ['Beijing'],
    'Russia': ['St. Petersburg'],
}

var $locations = $('#location');
$('#country').change(function () {
    var country = $(this).val(), lcns = locations[country] || [];

    var html = $.map(lcns, function(lcn){
        return '<option value="' + lcn + '">' + lcn + '</option>'
    }).join('');
    $locations.html(html)
});

});

Demo

Sehen Sie sich eine Live-Demonstration dieser Lösung an auf [ Fiddle](Geigen-Link hier).

Das obige ist der detaillierte Inhalt vonWie fülle ich kaskadierende Dropdown-Listen mit jQuery für eine verbesserte Browserkompatibilität?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!