a ,input ,button按钮区别

作者: 一只懒惰的蜜蜂 | 来源:发表于2017-05-12 13:45 被阅读135次

a ,input ,button按钮区别
HTML Button自动刷新页面的问题
按钮，图片，工具和响应式工具(css组件)
day07
今天的我知识点
DOM节点
和的相关应用</a></li><li><a href="#r8">JavaScript:浅谈<button>和<</a></li><li><a href="#r9">Enter提交表单</a></li><li><a href="#r10">2018-04-24</a></li></ol></div> <p>转载自：<a href="https://link.jianshu.com?t=http://www.cnblogs.com/ChandlerVer5/p/4658407.html" target="_blank" rel="nofollow">http://www.cnblogs.com/ChandlerVer5/p/4658407.html</a><br> 使用Firefox依次浏览，就能看到input和button的区别：input提交按钮显示的文字就是value，而button提交按钮显示的文字和value是独立的，从这个意义上来看，button更有表现力，是更值得推荐的提交按钮实现方式。</p> <p>还有关于它们在不同浏览器下显示的效果，也会影响我们的选择（下面就会介绍用其他标签，更好维持表现层的统一）：这个主要是ff和opera下line-height对input['button'],button不起作用。</p> <p>小结：从理论上来看，button形式的提交按钮优于input形式的提交按钮。但如果考虑浏览器通用性，很多时候还是只能使用input形式的提交按钮。</p> <p>再来说：a标签（以下为转载：）</p> <p>之前看过一些文章，说是用a标签来代替submit按钮更好一些，因为submit按钮在IE6下会有一些兼容的问题，不好统一，而且input的行高在各浏览器参差不齐，还不能用line-height控制，在按钮有一些交互效果的时候，a标签更容易实现，hover效果便可，所以许多前端喜欢用a标签来代替input。</p> <p>但是涉及到一点，input submit可以用来提交表单的值，而a标签似乎不太好传值，所以好多程序要求前端开发人员再把a标签改成input的，后来经过查找，发现a标签是一样的可以提交表单的，下面附上方法，也希望那些被程序要求把页面改来改去的前端人员告诉程序a标签一样可以提交表单的。<br> a标签提交表单的方式其实很简单的，首先你写一个方法<br> function tosubmit(){<br> var myform=document.getElementByIdx_x("myform");<br> myform.submit();<br> }</p> </div><div class="relateds"><h2>相关文章</h2><ul><li id="r1"><a href="/user/ntsjdttx.html"><img src="https://img.haomeiwen.com/ud/15-a7ac401939dd4df837e3bbf82abaa2a8.jpg" width="80"></a><h3><a href="/subject/nybztxtx.html">a ,input ,button按钮区别</a></h3><p>转载自：http://www.cnblogs.com/ChandlerVer5/p/4658407.html使用F...</p></li><li id="r2"><a href="/user/iplogttx.html"><img src="https://img.haomeiwen.com/ud/8-a356878e44b45ab268a3b0bbaaadeeb7.jpg" width="80"></a><h3><a href="/subject/oehooxtx.html">HTML Button自动刷新页面的问题</a></h3><p>button,input type=button按钮在IE和w3c，firefox浏览器区别： 1、当在IE浏览器...</p></li><li id="r3"><h3><a href="/subject/jemhtxtx.html">按钮，图片，工具和响应式工具(css组件)</a></h3><p>#按钮 1 button 2 input type=button/submit/reset 3 a #按钮的七种样...</p></li><li id="r4"><a href="/user/rgymfxtx.html"><img src="https://img.haomeiwen.com/is13085886/d81e5502dfc67a6c.PNG" width="80"></a><h3><a href="/subject/fjmapftx.html">day07</a></h3><p>2018.07.171.表单 2.input和button区别 3.搜索框 input和button区别 4.ma...</p></li><li id="r5"><h3><a href="/subject/jnvhkftx.html">今天的我知识点</a></h3><p>button 按钮 input 文本域 border-radius：直角变圆角去掉input的...</p></li><li id="r6"><a href="/user/mapipttx.html"><img src="https://img.haomeiwen.com/ud/4-3397163ecdb3855a0a4139c34a695885.jpg" width="80"></a><h3><a href="/subject/ynhulxtx.html">DOM节点</a></h3><p>1.在div后面添加一个通过input和button登录按钮： Input创建：姓名：账号：密码：按钮4 ...</p></li><li id="r7"><h3><a href="/subject/bxcykqtx.html"><input>和<textarea>的相关应用</a></h3><p><input type = "button">和<button></button>的区别 1. 表示就是一个普通...</p></li><li id="r8"><h3><a href="/subject/rvaxpttx.html">JavaScript:浅谈<button>和<</a></h3><p><button>标签与<input type=button>的对比定义和用法标签定义一个按钮。在button...</p></li><li id="r9"><h3><a href="/subject/ymenuttx.html">Enter提交表单</a></h3><p>表单回车提交如果有提交按钮 button/input 的 type="submit” 时，默认 input 获焦...</p></li><li id="r10"><a href="/user/vharzttx.html"><img src="https://img.haomeiwen.com/is11581379/41b2fd32f6dc4ad4.jpeg" width="80"></a><h3><a href="/subject/aleslftx.html">2018-04-24</a></h3><p>按钮 button 文本框 input 开始把他们的边框改成0</p></li></ul></div></div><div id="comments"><h2>网友评论</h2><ul></ul></div><ul></ul><div class="article_by"><div class="bytitle"><p>本文标题：<font color="#666">a ,input ,button按钮区别</font></p><p>本文链接：<font color="#666">https://www.haomeiwen.com/subject/nybztxtx.html</font></p></div></div></div><div class="meiwen-left fl mb"><div class="title ht"><h3>延伸阅读</h3><div class="share fr" id="bdshare"></div><i class="lt"></i><i class="rt"></i></div><div class="related"><ul class="related-list"><li><a class="meiwen" href="/mw/lbyctttx.html">那年盛夏诗歌</a></li><li><a class="meiwen" href="/sy/kbyctttx.html">环境监察队工作总结范文</a></li><li><a class="meiwen" href="/sy/hbyctttx.html">优秀教师学习心得范文</a></li><li><a class="meiwen" href="/sy/cbyctttx.html">华胥引的读后感300字</a></li><li><a class="meiwen" href="/yw/qbyctttx.html">《Its red》教学反思范文</a></li><li><a class="meiwen" href="/sy/fbyctttx.html">农资购销的合同范本</a></li><li><a class="meiwen" href="/sy/xbyctttx.html">竞选中队委优秀演讲稿</a></li><li><a class="meiwen" href="/yw/tbyctttx.html">辞金蹈海的成语解释</a></li><li><a class="meiwen" href="/ja/zvyctttx.html">《世纪宝鼎》公开课教案设计</a></li></ul></div><div class="picture" ><ul class="picture-list"><li><a class="meiwen" href="/article/69641.html"><img class="lazy" data-original="/uploads/allimg/1611/1-1611292156350-L.jpg" width="150" height="120" alt="因为爱你，所以牵挂"/><span>因为爱你，所以牵挂</span></a></li><li><a class="meiwen" href="/article/84632.html"><img class="lazy" data-original="/uploads/userup/2800/14V4C648-O08.jpg" width="150" height="120" alt="今生今世红尘醉——美到心碎的古诗词"/><span>今生今世红尘醉——美到</span></a></li><li><a class="meiwen" href="/article/53482.html"><img class="lazy" data-original="/uploads/allimg/1609/1-160ZPU1030-L.jpg" width="150" height="120" alt="一个90后的内心独白"/><span>一个90后的内心独白</span></a></li><li><a class="meiwen" href="/article/3639.html"><img class="lazy" data-original="/uploads/userup/1159/1432YGR-9294.jpg" width="150" height="120" alt="致已逝去的高中年华"/><span>致已逝去的高中年华</span></a></li></ul></div></div><div class="meiwen-left fl mb"><div id="pinglun"><div id="SOHUCS"></div></div></div><div class="meiwen-left fl"><div class="title ht"><h3>深度阅读</h3><ul class="list"><li><font color="#A2B088">您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！</font></li></ul><i class="lt"></i><i class="rt"></i></div><ul class="tags"><li><a class="meiwen" href="/huati/qingrenjie/">情人节</a></li><li><a class="meiwen" href="/huati/muqinjie/">母亲节</a></li><li><a class="meiwen" href="/huati/chongyangjie/">重阳节</a></li><li><a class="meiwen" href="/huati/qingmingjie/">清明节</a></li><li><a class="meiwen" href="/huati/duanwujie/">端午节</a></li><li><a class="meiwen" href="/huati/zhishujie/">植树节</a></li><li><a class="meiwen" href="/huati/yuanxiaojie/">元宵节</a></li><li><a class="meiwen" href="/huati/funvjie/">妇女节</a></li><li><a class="meiwen" href="/huati/yurenjie/">愚人节</a></li><li><a class="meiwen" href="/huati/shengdanjie/">圣诞节</a></li><li><a class="meiwen" href="/huati/fuqinjie/">父亲节</a></li><li><a class="meiwen" href="/huati/jiaoshijie/">教师节</a></li><li><a class="meiwen" href="/huati/ertongjie/">儿童节</a></li><li><a class="meiwen" href="/huati/laodongjie/">劳动节</a></li><li><a class="meiwen" href="/huati/qingnianjie/">青年节</a></li><li><a class="meiwen" href="/huati/jianjunjie/">建军节</a></li><li><a class="meiwen" href="/huati/wanshengjie/">万圣节</a></li><li><a class="meiwen" href="/huati/pinganye/">平安夜</a></li><li><a class="meiwen" href="/huati/guanggunjie/">光棍节</a></li><li><a class="meiwen" href="/huati/zhongqiujie/">中秋节</a></li><li><a class="meiwen" href="/huati/guoqingjie/">国庆节</a></li><li><a class="meiwen" href="/huati/ganenjie/">感恩节</a></li><li><a class="meiwen" href="/huati/labajie/">腊八节</a></li><li><a class="meiwen" href="/huati/">更多话题</a></li></ul></div><div class="cl"></div></div><div class="article-right"><div class="meiwen-right fr mb"><dt class="title hd"><h3>栏目导航</h3><i class="lt"></i><i class="rt"></i></dt><ul class="list-nav"><a class="meiwen" href="/c/hqtttttx.html">摄影</a><a class="meiwen" href="/c/vqtttttx.html">故事</a><a class="meiwen" href="/c/uttttttx.html">互联网</a><a class="meiwen" href="/c/cttttttx.html">读书</a><a class="meiwen" href="/c/yttttttx.html">旅行</a></ul></div></div><div class="meiwen-right fr mb"><div class="title hd"><h3>热点阅读</h3><i class="lt"></i><i class="rt"></i></div><ul class="right-list"><li><a class="meiwen" href="/subject/lebztxtx.html">出游季最难搞问题：一张有感染力的照片是怎么拍出来的？</a></li><li><a class="meiwen" href="/subject/kebztxtx.html">那年我比你大一岁，今年我比你大十岁！</a></li><li><a class="meiwen" href="/subject/qebztxtx.html">吾家有女初长成（一百三十二）男人的洞穴</a></li><li><a class="meiwen" href="/subject/febztxtx.html">离开常熟，出去闯荡</a></li><li><a class="meiwen" href="/subject/xebztxtx.html">寂寞的季节</a></li><li><a class="meiwen" href="/subject/zsbztxtx.html">注意事项（java）</a></li><li><a class="meiwen" href="/subject/asbztxtx.html">傲娇母亲傻逗猪</a></li><li><a class="meiwen" href="/subject/osbztxtx.html">幼年遭遇性侵：亲爱的，该死的不是你</a></li><li><a class="meiwen" href="/subject/vsbztxtx.html"> iOS图层树理解</a></li><li><a class="meiwen" href="/subject/psbztxtx.html">看到别人的精彩以后</a></li></ul></div></div></div></div><div class="footer"><p class="p_1"><a href="/about/aboutus.html">关于我们</a>|<a href="/about/service.html">服务条款</a>|<a href="/about/contact.html">联系我们</a>|<a href="/subject/nybztxtx.html">a ,input ,button按钮区别</a>|<a href="/about/tougao.html">投稿指南</a>|<a href="/sitemap.html">网站地图</a>|<a href="/rssmap.html">RSS订阅</a>|<a href="/about/paiban.html">排版工具</a>|<a href="javascript:vod(0);" onclick="Mobileurl()">手机版</a></p><p class="p_2">提供<a href="/meiwen/zhaichao/">经典美文摘抄</a>,<a href="/sanwen/">优美散文欣赏</a>,<a href="/shige/xiandai/">现代诗歌精选</a>,<a href="/xiaoshuo/">短篇小说</a>,<a href="/diary/suibi/">心情随笔</a>,<a href="/qingshu/">表白情书</a><a href="/fanwen/">范文</a>,<a href="/gushi/">故事会在线阅读</a>欣赏</p><p class="p_2">Copyright © 2014-2023 <a href="/">Haomeiwen.com</a> All Rights Reserved. <a href="/">好美文阅读网</a> 版权所有</p><p class="p_2">备案信息：<i></i>桂公网安备 45052102000051号 · 桂ICP备13007215号-3</p><div class="footer_service"><p class="p_2">本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯</p><p class="p_2">所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！</p></div></div><script src="https://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script><script type="text/javascript" src="https://apps.bdimg.com/libs/jquery-lazyload/1.9.5/jquery.lazyload.min.js"></script><script type="text/javascript">$("img.lazy").lazyload({effect : "fadeIn"});</script><script type="text/javascript" src="/img/jquery.meiwen.min.js"></script></body></html>