Maison > interface Web > js tutoriel > Comment ajouter des événements aux éléments de sélection générés dynamiquement à l'aide de jQuery

Comment ajouter des événements aux éléments de sélection générés dynamiquement à l'aide de jQuery

高洛峰
Libérer: 2017-01-03 16:48:06
original
1738 Les gens l'ont consulté

Dans le projet, l'élément select doit être généré dynamiquement lorsque vous cliquez sur le bouton. Pour éviter que les données ne soient obtenues du serveur à chaque fois que vous cliquez sur le bouton (car les données sont les mêmes), vous pouvez écrire le code. comme ça

1 , définissez d'abord la variable js globale

var strVoucherGroupSelect ="";

2. Écrivez le code pour obtenir les données du serveur en js

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();
    }
  });
}
Copier après la connexion

3 Écrivez le code d'initialisation dans la page

$().ready(function(){
    getVoucherGroupData();
  });
Copier après la connexion

4 Lorsque vous devez ajouter dynamiquement un select, vous pouvez écrire comme ceci

$("#divID").append(genVoucherGroupSelect(rowID) );
Copier après la connexion

5 Ajoutez un événement de clic pour sélectionner, ajoutez

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

après la quatrième étape

Le jQuery ci-dessus La méthode d'ajout d'événements à l'élément select généré dynamiquement est tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence et j'espère que vous le soutiendrez. le site Web PHP chinois.

Pour plus d'articles sur la façon dont jQuery ajoute des événements aux éléments sélectionnés générés dynamiquement, veuillez faire attention au site Web PHP chinois !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal