jquery Ajax implementiert Select, um das Parsen von Dateninstanzen dynamisch hinzuzufügen

小云云
Freigeben: 2018-05-26 15:53:31
Original
2421 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich die relevanten Informationen von jquery Ajax zum dynamischen Hinzufügen von Daten über Select vor. Ich hoffe, dass er allen helfen kann.

jquery Ajax implementiert Select, um Daten dynamisch hinzuzufügen

1. Hintergrund

Vor kurzem bin ich bei der Arbeit auf ein Problem gestoßen über wählen. Unter normalen Umständen sind die Daten im Auswahl-Dropdown-Feld festgelegt oder der Listenwert wird direkt in JSP gelesen und angezeigt. Dieses Mal müssen wir jedoch Select mit anderen Optionsfeldern verknüpfen, das heißt, wir müssen Optionsdaten dynamisch hinzufügen. Nachdem ich viele Informationen konsultiert hatte, habe ich es endlich verstanden. Lassen Sie mich im Folgenden erläutern, wie Sie jQuery und Ajax verwenden, um Select zum dynamischen Hinzufügen von Daten zu implementieren.

2. Der Code in diesem Artikel implementiert die Funktion der Verknüpfung des Fahrzeugmodells mit der Fahrzeugmarke.Zuallererst ist es die Definition der Fahrzeugmarke in JSP. Das ist sehr einfach. Wie folgt:

  • *车系
  • Nach dem Login kopieren

    Dann ist derJS-Code:

    function getModelList(){ var brandId = $("select[name=brandId]").val(); $("select[name=modelId]").empty(); //清空 $.ajax({url:'/getModelList.do', type:"post", data:{ brandId : brandId }, cache: false, error:function(){ }, success:function(data){ var modelList = data.modelList; if(modelList && modelList.length != 0){ for(var i=0; i"; //动态添加数据 $("select[name=modelId]").append(option); } } } }); }
    Nach dem Login kopieren

    Schließlich ist derBackend-Code:

    @RequestMapping("/getModelList") @ResponseBody public Map getModelList(Integer brandId) { List modelList = null; try{ modelList = carInfoManager.getSrmsModelListByBrandId(brandId); }catch(Exception e){ LOGGER.error("获取年租车辆型号异常:{}", e.getMessage()); } Map returnMap = Maps.newHashMap(); returnMap.put("modelList", modelList); return returnMap; }
    Nach dem Login kopieren

    Verwandte Empfehlungen:

    So fügen Sie Stile dynamisch zu den von Ajax zurückgegebenen HTML-Tags hinzu

    Detaillierte Erläuterung der Verwendung von jQuery zum dynamischen Hinzufügen kleiner Anzeigen

    Beispiel für die gemeinsame Nutzung von jQuery mit dynamischem Hinzufügen von .active, um Navigationseffektcode zu erzielen

    Das obige ist der detaillierte Inhalt vonjquery Ajax implementiert Select, um das Parsen von Dateninstanzen dynamisch hinzuzufügen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    Verwandte Etiketten:
    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 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!