Heim >Web-Frontend >js-Tutorial >So fügen Sie mithilfe von jQuery Ereignisse zu dynamisch generierten Auswahlelementen hinzu

So fügen Sie mithilfe von jQuery Ereignisse zu dynamisch generierten Auswahlelementen hinzu

高洛峰
高洛峰Original
2017-01-03 16:48:061698Durchsuche

Im Projekt muss das Auswahlelement beim Klicken auf die Schaltfläche dynamisch generiert werden. Um zu verhindern, dass bei jedem Klicken auf die Schaltfläche Daten vom Server abgerufen werden (da die Daten dieselben sind), kann der Code dies tun so geschrieben werden

1, definieren Sie zuerst die globale js-Variable

var strVoucherGroupSelect ="";

2. Schreiben Sie den Code um die Serverdaten in js zu erhalten

function genVoucherGroupSelect(rowID){
  return $(strVoucherGroupSelect).attr("id", "sl_" + rowID).parent().html();  //返回增加ID后的下拉框完整html
}
function getVoucherGroupData(){
  $.ajax({
    type: "Post",
    url: "/BillWeb/OrgVoucher/GetVoucherGroup",
    dataType: "json",
    data: "",
    cache: true,
    success: function(res) {
        var str = $("<select></select>");
        var option = "";
        for(var j =0;j < res.length; j++)
        {
          option += "<option value=\"" + res[j].Value + "\">" + res[j].Text + "</option>";
        }
        strVoucherGroupSelect = $(str).html(option).parent().html();
    }
  });
}

3 Schreiben Sie den Initialisierungscode in die Seite

$().ready(function(){
    getVoucherGroupData();
  });

4 Wenn Sie dynamisch müssen Fügen Sie eine Auswahl hinzu, Sie können so schreiben:

$("#divID").append(genVoucherGroupSelect(rowID) );

5 Fügen Sie ein Klickereignis zur Auswahl hinzu und fügen Sie

$("#sl_0" + rowID).bind("change", function(){
   alert("你点击了下拉框");
})

nach dem hinzu Vierter Schritt

Die obige jQuery-Methode zum Hinzufügen von Ereignissen zum dynamisch generierten Auswahlelement ist der gesamte vom Editor freigegebene Inhalt. Ich hoffe, dass er Ihnen eine Referenz geben kann, und ich hoffe, Sie wird die chinesische PHP-Website unterstützen.

Weitere Artikel darüber, wie jQuery Ereignisse zu dynamisch generierten ausgewählten Elementen hinzufügt, finden Sie auf der chinesischen PHP-Website!


Stellungnahme:
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