支付宝小程序表单组件 Label

用来改进表单组件的可用性，使用for属性找到对应的id，或者将控件放在该标签下，当点击时，就会触发对应的控件。

for优先级高于内部控件，内部有多个控件的时候默认触发第一个控件。

目前可以绑定的控件有：, , , </code></p> <h2><a href="#api">API</a></h2> <table class="xhe-table"> <thead> <tr> <th>属性名</th> <th>类型</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td>for</td> <td>String</td> <td>绑定控件的 id</td> </tr> <tr> <td>class</td> <td>String</td> <td>外部样式</td> </tr> <tr> <td>style</td> <td>String</td> <td>内联样式</td> </tr> </tbody> </table> <h2><a href="#%E7%A4%BA%E4%BE%8B">示例</a></h2> <pre><code><view class="section"> <view class="title">Checkbox，label 套 checkbox</view> <checkbox-group> <view> <label> <checkbox value="aaa" /> <text>aaa</text> </label> </view> <view> <label> <checkbox value="bbb" /> <text>bbb</text> </label> </view> </checkbox-group> </view> </view> <view class="section"> <view class="title">Radio，通过 for 属性关联</view> <radio-group> <view> <radio id="aaa" value="aaa" /> <label for="aaa">aaa</label> </view> <view> <radio id="bbb" value="bbb" /> <label for="bbb">bbb</label> </view> </radio-group> </view> </view> <view class="section"> <view class="title">多个 Checkbox 只选中第一个</view> <label> <checkbox>选中我</checkbox> <checkbox>选不中</checkbox> <checkbox>选不中</checkbox> <checkbox>选不中</checkbox> <view> <text>Click Me</text> </view> </label> </view> </view></code></pre><hr></div> <div class="chapter"> <div class="prev">< <a href="aliminiapp-xlrw28rq.html" rel="next" title="支付宝小程序表单组件 输入框·Textarea">支付宝小程序表单组件 输入框·Textarea</a></div> <div class="next"><a href="aliminiapp-7jvo28rt.html" rel="next" title="支付宝小程序表单组件 Radio">支付宝小程序表单组件 Radio</a> ></div> </div> </div> <div id="rightcolumn"> <div class="ColLeft fl"> <div class="CategoryTree"> <div class="titlebar"><h3>分类导航</h3></div> <ul> <li><a href="javascript:void(0);">HTML / CSS</a> <ul> <li><a href="/html/index.html">HTML 教程</a></li> <li><a href="/html/html5-intro.html">HTML5 教程</a></li> <li><a href="/css/css-tutorial.html">CSS 教程</a></li> <li><a href="/css/css3-tutorial.html">CSS3 教程</a></li> <li><a href="/bootstrap/index.html">Bootstrap 教程</a></li> <li><a href="/charsets/index.html" target="_top">HTML 字符集</a></li> </ul> </li> <li><a href="javascript:void(0);">JavaScript</a> <ul class="double-li"> <li><a href="/javascript/index.html">JavaScript 教程</a></li> <li><a href="/htmldom/index.html" target="_top">HTML DOM 教程</a></li> <li><a href="/jquery/index" target="_top">jQuery 教程</a></li> <li><a href="/angularjs/index.html" target="_top">AngularJS 教程</a></li> <li><a href="/jqueryui/index.html" target="_top">jQuery UI 教程</a></li> <li><a href="/jquerymobile/index.html" target="_top">jQuery Mobile 教程</a></li> <li><a href="/jeasyui/index.html">jQuery EasyUI 教程</a></li> <li><a href="/nodejs/index.html" target="_top">Node.js 教程</a></li> <li><a href="/ajax/index.html" target="_top">AJAX 教程</a></li> <li><a href="/json/index.html" target="_top">JSON 教程</a></li> <li><a href="/vbscript/index.html" target="_top">VBScript 教程</a></li> <li><a href="/googleapi/index.html" target="_top">Google 地图教程</a></li> <li><a href="/firebug/index.html" target="_top">Firebug 教程</a></li> </ul> </li> <li><a href="javascript:void(0);">服务端语言</a> <ul class="double-li"> <li><a href="/php/php-tutorial.html" target="_top">PHP 教程</a></li> <li><a href="/python/python-tutorial.html" target="_top">Python 教程</a></li> <li><a href="/python3/python3-tutorial.html" target="_top">Python3 教程</a></li> <li><a href="/ruby/ruby-tutorial.html" target="_top">Ruby 教程</a></li> <li><a href="/linux/linux-tutorial.html" target="_top">Linux教程</a></li> <li><a href="/java/java-tutorial.html" target="_top">Java 教程</a></li> <li><a href="/c/index.html" target="_top">C 语言教程</a></li> <li><a href="/servlet/servlet-tutorial.html" target="_top">Servlet 教程</a></li> <li><a href="/jsp/jsp-tutorial.html" target="_top">JSP 教程</a></li> <li><a href="/nodejs/nodejs-tutorial.html" target="_top">Node.js 教程</a></li> <li><a href="/asp/asp-tutorial.html" target="_top">ASP 教程</a></li> <li><a href="/csharp/csharp-tutorial.html" target="_top">C# 教程</a></li> <li><a href="/ado/ado-tutorial.html" target="_top">ADO 教程</a></li> <li><a href="/regexp/regexp-tutorial.html" target="_top">正则表达式教程</a></li> <li><a href="/designpattern/design-pattern-tutorial.html" target="_top">设计模式</a></li> </ul> </li> <li><a href="javascript:void(0);">数据库</a> <ul> <li><a href="/sql/sql-tutorial.html" target="_top">SQL 教程</a></li> <li><a href="/mysql/mysql-tutorial.html" target="_top">MySQL 教程</a></li> <li><a href="/sqlite/sqlite-tutorial.html" target="_top">SQLite 教程</a></li> <li><a href="/mongodb/mongodb-tutorial.html" target="_top">Mongodb 教程</a></li> <li><a href="/redis/redis-tutorial.html" target="_top">Redis 教程</a></li> </ul> </li> <li><a href="javascript:void(0);">XML 语言</a> <ul class="double-li"> <li><a href="/xml/xml-tutorial.html" target="_top">XML 教程</a></li> <li><a href="/dtd/dtd-tutorial.html" target="_top">DTD 教程</a></li> <li><a href="/dom/dom-tutorial.html" target="_top">XML DOM 教程</a></li> <li><a href="/xsl/xsl-tutorial.html" target="_top">XSLT 教程</a></li> <li><a href="/xpath/xpath-tutorial.html" target="_top">XPath 教程</a></li> <li><a href="/xquery/xquery-tutorial.html" target="_top">XQuery 教程</a></li> <li><a href="/xlink/xlink-tutorial.html" target="_top">XLink 教程</a></li> <li><a href="/xlink/xlink-tutorial.html" target="_top">XPointer 教程</a></li> <li><a href="/schema/schema-tutorial.html" target="_top">Schema 教程</a></li> <li><a href="/soap/soap-tutorial.html" target="_top">SOAP 教程</a></li> <li><a href="/wsdl/wsdl-tutorial.html" target="_top">WSDL 教程</a></li> <li><a href="/rss/rss-tutorial.html" target="_top">RSS 教程</a></li> <li><a href="/rdf/rdf-tutorial.html" target="_top">RDF 教程</a></li> <li><a href="/xslfo/xslfo-tutorial.html" target="_top">XSL-FO 教程</a></li> <li><a href="/svg/svg-tutorial.html" target="_top">SVG 教程</a></li> </ul> </li> <li><a href="javascript:void(0);">ASP.NET</a> <ul> <li><a href="/aspnet/aspnet-tutorial.html" title="ASP.NET 教程">ASP.NET 教程</a></li> <li><a href="/csharp/csharp-tutorial.html" title="C# 教程">C# 教程</a></li> <li><a href="/aspnet/webpages-intro.html" title="Web Pages 教程">Web Pages 教程</a></li> <li><a href="/aspnet/razor-intro.html" title="Razor 教程">Razor 教程</a></li> <li><a href="/aspnet/mvc-intro.html" title="MVC 教程">MVC 教程</a></li> <li><a href="/aspnet/aspnet-intro.html" title="Web Forms 教程">Web Forms 教程</a></li> </ul> </li> <li><a href="javascript:void(0);">Web Services</a> <ul> <li><a href="/webservices/webservices-tutorial.html" target="_top">Web Services 教程</a></li> <li><a href="/wsdl/wsdl-tutorial.html" target="_top">WSDL 教程</a></li> <li><a href="/soap/soap-tutorial.html" target="_top">SOAP 教程</a></li> <li><a href="/rss/rss-tutorial.html" target="_top">RSS 教程</a></li> <li><a href="/rdf/rdf-tutorial.html" target="_top">RDF 教程</a></li> </ul> </li> <li><a href="javascript:void(0);">网站建设</a> <ul> <li><a href="/web/web-buildingprimer.html" target="_top">网站建设指南</a></li> <li><a href="/browsers/browser-information.html" target="_top">Web 浏览器</a></li> <li><a href="/http/http-tutorial.html" target="_top">HTTP 教程</a></li> <li><a href="/hosting/hosting-tutorial.html" target="_top">Web 主机</a></li> <li><a href="/tcpip/tcpip-tutorial.html" target="_top">Web TCP/IP</a></li> <li><a href="/w3c/w3c-tutorial.html" target="_top">Web W3C</a></li> <li><a href="/quality/quality-tutorial.html" target="_top">Web 品质</a></li> </ul> </li> <li><a href="javascript:void(0);">参考手册</a> <ul class="double-li"> <li><a href="/htmlref/html-reference.html" target="_top">HTML 标签参考手册</a></li> <li><a href="/htmlref/ref-eventattributes.html" target="_top">HTML 事件参考手册</a></li> <li><a href="/htmlref/html-colorname.html" target="_top">HTML 颜色参考手册</a></li> <li><a href="/cssref/css-reference.html" target="_top">CSS 1,2,3 参考手册</a></li> <li><a href="/jsref/jsref-tutorial.html" target="_top">JavaScript 参考手册</a></li> <li><a href="/jsref/jsref-tutorial.html" target="_top">HTML DOM 参考手册</a></li> <li><a href="/jquery/jquery-ref-selectors.html" target="_top">jQuery 参考手册</a></li> <li><a href="/jquerymobile/jquerymobile-ref-data.html" target="_top">jQuery Mobile 参考手册</a></li> <li><a href="/linux/linux-command-manual.html">Linux 命令大全</a></li> <li><a href="/php/php-ref-array.html" target="_top">PHP 参考手册</a></li> <li><a href="/sql/sql-quickref.html" target="_top">SQL 参考手册</a></li> <li><a href="/asp/asp-ref-response.html" target="_top">ASP 参考手册</a></li> <li><a href="/ado/ado-command.html" target="_top">ADO 参考手册</a></li> <li><a href="/vbscript/vbscript-ref-functions.html" target="_top">VBScript 参考手册</a></li> <li><a href="/googleAPI/google-maps-ref.html">Google Maps 参考手册</a></li> <li><a href="/aspnet/webpages-ref-classes.html" target="_top">Razor 参考手册</a></li> <li><a href="/aspnet/aspnet-ref-htmlcontrols.html" target="_top">.NET 参考手册</a></li> </ul> </li> <li><a href="javascript:void(0);">测验/考试</a> <ul> <li><a href="/quiz/html-quiz.html" target="_top" title="HTML 测验">HTML 测验</a></li> <li><a href="/quiz/html5-quiz.html" target="_top" title="HTML5 测验">HTML5 测验</a></li> <li><a href="/quiz/xhtml-quiz.html" target="_top" title="XHTML 测验">XHTML 测验</a></li> <li><a href="/quiz/css-quiz.html" target="_top" title="CSS 测验">CSS 测验</a></li> <li><a href="/quiz/javascript-quiz.html" target="_top" title="JavaScript 测验">JavaScript 测验</a></li> <li><a href="/quiz/jquery-quiz.html" target="_top" title="jQuery 测验">jQuery 测验</a></li> <li><a href="/quiz/xml-quiz.html" target="_top" title="XML 测验">XML 测验</a></li> <li><a href="/quiz/asp-quiz.html" target="_top" title="ASP 测验">ASP 测验</a></li> <li><a href="/quiz/php-quiz.html" target="_top" title="PHP 测验">PHP 测验</a></li> <li><a href="/quiz/sql-quiz.html" target="_top" title="SQL 测验">SQL 测验</a></li> </ul> </li> <li><a href="javascript:void(0);">开发工具</a> <ul> <li><a href="/eclipse/index.html" target="_top" title="Eclipse">Eclipse 教程</a></li> <li><a href="/firebug/index.html" target="_top" target="_top" title="Firebug">Firebug 教程</a></li> <li><a href="/css-radius" target="_top" target="_top" title="Firebug">前端工具集</a></li> </ul> </li> </ul> </div> </div> <div style="margin-left:5px;"><h2 style="color:#67ad03">关注微信下载离线手册</h2> <img src="/assets/images/qrcode.jpg" width="150" height="150" alt="bootwiki移动版"/> </a> <a target="_blank" href="//shang.qq.com/wpa/qunwpa?idkey=ba72923f64a77a185f18b4a7ca6b8fbe7ba6da842c321bd9e9282d4bd62df4b7" id="qqhref"><img border="0" src="//pub.idqqimg.com/wpa/images/group.png" alt="bootwiki" title="bootwiki"></a><br>(群号：<span id="qqid">472910771</span>) </div> <div class="wideSkyscraper"><script type="text/javascript" language="javascript">G160x600();</script></div> </div> <div class="space"></div> <div id="navfoot"><a href="/jquery/index.html" target="_self">jQuery教程</a> | <a href="/course/photoshop">Photoshop教程</a> | <a href="/course/word" target="_blank">Word教程</a> | <a href="/course/powerpoint" target="_self">PPT教程</a> | <a href="/course/sketch">Sketch草图大师</a> | <a href="/course/maya" target="_blank">Maya教程</a> | <a href="/eyuyan/index.html" target="_blank">易语言教程</a> | <a href="/course/coreldraw" target="_blank">CorelDraw教程</a> | <a href="/course/aspnet" target="_self">ASP.NET</a> | <a href="/redis/index.html">Redis数据库</a> | <a href="/intellijidea/index.html" target="_blank">IntelliJ IDEA教程</a> | <a href="/pycharm/" target="_blank">PyCharm</a> | <a href="/linux/index.html" target="_blank">Linux自学</a> | <a href="/matlab/index.html" target="_blank">Matlab教程</a> | <a href="/" target="_blank">菜鸟教程</a></div> <div id="footer"> <p class="fl">Copyright © 2008-2018 | <a href="/">Bootwiki中文网</a> | <a href="https://beian.miit.gov.cn" target="_blank">鲁ICP备19015215号-2</a></p> <p class="fr"><a href="/about/index.html#about" rel="nofollow">关于我们</a> | <a href="/about/contact.html#contact" rel="nofollow">联系我们</a> | <a href="/about/law.html#law" rel="nofollow">免责声明</a> | <a href="/about/sitemap.html#map" rel="nofollow">网站地图</a> | Powered by <a href="http://www.bootweb.cn/" rel="nofollow" target="_blank">青岛博维网络有限公司</a> </div> <div class="space"></div> <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"24"},"slide":{"type":"slide","bdImg":"0","bdPos":"right","bdTop":"100"}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script> <script> $(window).load(function(){ $("pre").addClass("prettyprint"); //prettyPrint(); }) $(function(){ $(".CategoryTree > ul > li").hover(function(){ $(this).addClass("selected"); $(this).children("a:eq(0)").addClass("h2-tit"); $(this).children("ul").show(); },function(){ $(this).removeClass("selected"); $(this).children(".tit").removeClass("h2-tit"); $(this).children("ul").hide(); }) }) /**/ function setClipboardText(event){ event.preventDefault();//阻止元素发生默认的行为（例如，当点击提交按钮时阻止对表单的提交）。 var node = document.createElement('div'); //对documentfragment不熟，不知道怎么获取里面的内容，用了一个比较笨的方式 node.appendChild(window.getSelection().getRangeAt(0).cloneContents()); //getRangeAt(0)返回对基于零的数字索引与传递参数匹配的选择对象中的范围的引用。对于连续选择，参数应为零。 var htmlData = '<div>' + node.innerHTML + '<br /><br />来源：BootWiki<br />' + '链接：https://www.bootwiki/aliminiapp/aliminiapp-pxew28rs.html<br />' + '著作权归作者所有<br />' + '商业转载请联系作者获得授权，非商业转载请注明出处<br /><br />' + '</div>'; var textData = window.getSelection().getRangeAt(0) + '\n\n来源：BootWiki\n' + '链接：https://www.bootwiki/aliminiapp/aliminiapp-pxew28rs.html\n' + '著作权归作者所有\n' + '商业转载请联系作者获得授权，非商业转载请注明出处\n\n'; if(event.clipboardData){ event.clipboardData.setData("text/html", htmlData); //setData(剪贴板格式, 数据) 给剪贴板赋予指定格式的数据。返回 true 表示操作成功。 event.clipboardData.setData("text/plain",textData); } else if(window.clipboardData){ //window.clipboardData的作用是在页面上将需要的东西复制到剪贴板上，提供了对于预定义的剪贴板格式的访问，以便在编辑操作中使用。 return window.clipboardData.setData("text", textData); } }; document.addEventListener('copy',function(e){ setClipboardText(e); }); function NewWindow(text) { win=window.open(text,'','top=0,left=0,width=400,height=350'); } var host = window.location.host; if (/(iPhone|iPad|iPod|iOS|BlackBerry|IEMobile|Android)/i.test(navigator.userAgent)) { if(host == 'www.waitang.com') { href = window.location.href; href=href.replace(/www.waitang.com/, "m.waitang.com"); window.location.href=href; } } </script> <script src="//www.bootwiki.com/assets/hl/run_prettify.js"></script> <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"24"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script> </body> </html>