按钮的html
<!-- 学校 --> <div class="layui-inline"> <label class="layui-form-label"> <button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="yun.popOpen('/out/school/crmAddSchool', '添加学校信息','690','400')" title="#(i18n.get('新增学校'))"> <i class="layui-icon"></i> </button> #(i18n.get('学校')) </label> <div class="layui-input-inline"> <select id="school" name="personStudent.schoolId" onchange="yun.casSel(this,'/out/school/casSelName','grade')" lay-verify="" > <option ></option> #for(school : schools ) <option value="#(school.id)">#(school.schoolName)</option> #end </select> </div> </div>
问题：项目中出现的问题，学校前边有一个按钮是使用label包裹了button,给button添加了点击事件，每次点击的时候label总是会触发button的点击事件？
答案： 这个主要是label的绑定元素的问题，包裹元素即绑定了某个元素，那么给这个元素设置事件的时候等同于label也会会有事件了，这样点击button会触发事件，点击label也会触发事件。
想要的结果：这里的样式就是需要这样的，不可以改变。但是点击button触发事件，点击label不触发事件。
解决办法：这里主要是用到了layui的样式，所以只需要把label改成其他的标签就可以了，他的class保留，这样样式就保留下来了。
<!-- 学校 --> <div class="layui-form-label"> <button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="yun.popOpen('/out/school/crmAddSchool', '添加学校信息','690','400')" title="#(i18n.get('新增学校'))"> <i class="layui-icon"></i> </button> #(i18n.get('学校'))
</div>
这样就可以实现了。
这里介绍了官方的示例：
w3c示例
显式绑定
<form> <label for="male">Male</label> <input type="radio" name="sex" id="male" /> <br /> <label for="female">Female</label> <input type="radio" name="sex" id="female" /> </form>
提示和注释
注释：可以通过使用 "for" 属性将 label 绑定到另一个元素，或者直接在 label 元素内部放置元素。
使用for为lable关联指定的元素上，这样点击label的时候就等于是点击了绑定的元素。
这种使用for标签的方式是显示的方式
隐式的方式是把需要绑定的标签放到label内部，让label包裹上这个需要绑定的元素
隐式绑定
<!DOCTYPE HTML> <html> <body> <form> <label>Male<input type="radio" name="sex" /></label> <br /> <label>Female <input type="radio" name="sex" /></label> </form> </body> </html>
这样不使用for就可以绑定。