Maison >interface Web >Tutoriel Layui >La méthode de Layui pour écouter plusieurs événements radio
Les conditions requises sont les suivantes : Si vous souhaitez sélectionner le bouton radio 3, cochez toutes les cases sous le bouton radio 3
S'il n'y a pas beaucoup d'informations dans le panneau, vous pouvez ajouter un événement d'écoute fixe à chaque bouton radio 3
Mais dans le projet lui-même, il n'y en a pas seulement deux, mais des dizaines, et vous ne pouvez pas le lier à cette fois. Définissez un filtre lay et ajoutez un événement form.on('radio(filter)')
J'ai donc écrit ici une méthode générale pour surveiller plusieurs radios :
// 选取“单选框3”,“单选框3”下的所有内容全选 var flagID = document.querySelectorAll("input[title='单选框3']"); var aFlagID = new Array(); for (var j = 0; j < flagID.length; j++) { aFlagID.push(flagID[j].id); } // 监听所有title为“单选框3”的radio // 注意:此时title为“单选框3”的radio的id和lay-filter需要设为一致!!!! for (var i = 0; i < aFlagID.length; i++) { form.on('radio('+aFlagID[i]+')', function(data) { $(data.elem).next().next().children("input").addClass(""+aFlagID[i]+"_other"); $("."+aFlagID[i]+"_other").attr("checked", "checked"); $("."+aFlagID[i]+"_other + div").addClass('layui-form-checked'); element.init(); }); }
This Here. , le filtre lay de chaque radio est obtenu via l'identifiant, et l'identifiant de la radio et le filtre lay sont définis pour être les mêmes
$(data.elem) est l'élément DOM actuellement surveillé ; ici Regardez la page qui a été rendue avec succès par le navigateur ;
L'élément d'entrée est sélectionné à ce moment, qui est le bouton radio 3, mais comme layui embellit l'entrée, cette entrée n'est pas affichée
Faites attention à l'image ci-dessous : le prochain élément d'entrée à ce moment-là est le "bouton radio 3" que nous voyons
Assurez-vous de rechercher lors de la sélection de l'élément Quasi-élément ! Cette méthode présente les limitations suivantes : 1. Vous devez définir manuellement l'identifiant et le filtre lay pour chaque "Radio Box 3" ; 2. Box 3" L'identifiant et le filtre lay de "Box 3" doivent être cohérents ; 3. Lors de l'obtention d'éléments, la méthode jQuery est utilisée pour trouver des éléments ; 4. La manière pour trouver les éléments, il faut les modifier en fonction des différentes mises en page. Recommandé :Tutoriel d'utilisation de Layui
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!