Heim > Web-Frontend > js-Tutorial > Hauptteil

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

Susan Sarandon
Freigeben: 2024-10-28 02:33:02
Original
428 Leute haben es durchsucht

How to Populate Cascading Dropdowns with jQuery for Improved Browser Compatibility?

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>
<div class="code" style="position:relative; padding:0px; margin:0px;"><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)
});
Nach dem Login kopieren

});

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!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!