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
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!