input type submit="submit" 和"button"有什么区别

解析&button&跟&input type=&button&& 的区别
&来源:读书人网&【读书人网():综合教育门户网站】
解析button和input typebutton 的区别一、定义和用法button?标签定义的是一个按钮。在?button?元素
解析&button&和&input type=&button&& 的区别
一、定义和用法&button&?标签定义的是一个按钮。在?button?元素内部,可以放置文本或图像。这是&button&与使用?input?元素创建的按钮的不同之处。二者相比较,?&button&?控件提供了更为强大的功能和更丰富的内容。&button&?与?&/button&?标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或内容。例如,我们可以在按钮中包括一个图像和相关的文本,用它们在按钮中创建一个吸引人的标记图像。唯一禁止使用的元素是图像映射,因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。请始终为按钮规定?type?属性。Internet Explorer?的默认类型是?"button",而其他浏览器中(包括?W3C?规范)的默认值是?"submit"。二、浏览器支持所有主流浏览器都支持?&button&?标签。重要事项:如果在?HTML?表单中使用?button?元素,不同的浏览器会提交不同的值。Internet Explorer?将提交?&button&?与?&button/&?之间的文本,而其他浏览器将提交?value?属性的内容。请在?HTML?表单中使用?input?元素来创建按钮。三、注意事项在使用&button&标签时很容易想当然的当成?&input type="button"&使用,这很容易产生以下几点错误用法:?1、通过$('#customBtn').val()获取&button id="customBtn" value="test"&按钮&/button& value的值?? ? 在IE(IE内核)下这样用到得的是值是“按钮”,而不是“test”,非IE下得到的是“test”。?参加上面标红的第一句话。  这一点要和&input type="button"&区分开。? ? ? ? ? ? ? ? ? ? ? ? ??? ? 通过这两种方式$('#customBtn').val(),$('#customBtn').attr('value')在不同浏览器的获得值,如下:?Browser/Value$('#customBtn').val()$('#customBtn').attr('value')Firefox13.0testtestChrome15.0testtestOpera11.61testtestSafari5.1.4testtestIE9.0按钮按钮?验证这一点可以在测试下面的代码??"input?button"/&??????&/form&??&/body&??&/html& ?
javaScript_miss
学习了。。。
结论就是,让button,从哪里来滚回哪里去吧!
xiaotao.2010
幽灵线程 写道结论就是,让button,从哪里来滚回哪里去吧!+1
xiaotao.2010 写道幽灵线程 写道结论就是,让button,从哪里来滚回哪里去吧!+1+1button和input type=button的区别及注意事项
作者:佚名
字体:[ ] 来源:互联网 时间:12-31 11:25:21
button控件与inputtype=button相比,提供了更为强大的功能和更丰富的内容。button与/button标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或多媒体内容,需要了解的朋友可以参考下
&button&标签 定义和用法 &button&标签定义一个按钮。 在button元素内部,您可以放置内容,比如文本或图像。这是该元素与使用input元素创建的按钮之间的不同之处。 &button&控件与&inputtype=&button&&相比,提供了更为强大的功能和更丰富的内容。&button&与&/button&标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或多媒体内容。例如,我们可以在按钮中包括一个图像和相关的文本,用它们在按钮中创建一个吸引人的标记图像。 唯一禁止使用的元素是图像映射,因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。 请始终为按钮规定type属性。InternetExplorer的默认类型是&button&,而其他浏览器中(包括W3C规范)的默认值是&submit&。 浏览器支持 所有主流浏览器都支持&button&标签。 重要事项:如果在HTML表单中使用button元素,不同的浏览器会提交不同的值。InternetExplorer将提交&button&与&button/&之间的文本,而其他浏览器将提交value属性的内容。请在HTML表单中使用input元素来创建按钮。 注意事项 在使用&button&标签时很容易想当然的当成&inputtype=&button&&使用,这很容易产生以下几点错误用法: 1、通过$('#customBtn').val()获取&buttonid=&customBtn&value=&test&&按钮&/button&value的值 在IE(IE内核)下这样用到得的是值是&按钮&,而不是&test&,非IE下得到的是&test&。参加上面标红的第一句话。 这一点要和&inputtype=&button&&区分开。 通过这两种方式$('#customBtn').val(),$('#customBtn').attr('value')在不同浏览器的获得值,如下:
Browser/Value
$('#customBtn').val()
$('#customBtn').attr('value')
Firefox13.0
Chrome15.0
Opera11.61
Safari5.1.4
验证这一点可以在测试下面的代码 代码如下: &html& &head& &metahttp-equiv="Content-Type"content="text/charset=utf-8"/& &scripttype="text/javascript"src="jquery-1.4.4.min.js"&&/script& &scripttype="text/javascript"& $(function(){ $('#test1').click(function(){ alert($('#customBtn').attr('value')); }); $('#test2').click(function(){ alert($('#customBtn').val()); }); }); &/script& &/head& &body& &buttonid="customBtn"value="test"&按钮&/button& &inputtype="button"id="test1"value="getattr"/& &inputtype="button"id="test2"value="getval"/& &/body& &/html& 2、无意中把&button&标签放到了&form&标签中,你会发现点击这个button变成了提交,相当于&inputtype=&submit&/& 这一点参见上面第二句标红的话就明白什么意思了。 不要把&button&标签当成&form&中的input元素。 验证这一点可以在测试下面的代码 代码如下: &html& &body& &formaction=""& &button&button&/button& &inputtype="submit"value="inputsubmit"/& &inputtype="button"value="inputbutton"/& &/form& &/body& &/html&
大家感兴趣的内容
12345678910
最近更新的内容&inputid="Submit"onclick="j()? - 爱问知识人
(window.slotbydup=window.slotbydup || []).push({
id: '2491531',
container: s,
size: '150,90',
display: 'inlay-fix'
这一句是什么意思
" onclick="j ()" type="button" value=" 确 认 继 续 注 册 " name="Submit" /&
这一句是什么意思,onclick="j ()" :适当单击时干什么,register_submit :是什么意思,代表什么,type="button"
:是什么意思,name="Submit" :这个是什么意思
就点击button时候触发一个script 应该是popup 一个提示框吧 不太清楚
 咏柳[唐]贺知章   碧玉妆成一树高,(如同碧玉妆扮着高高的柳树,)   万条垂下绿丝绦。 ( 长长的柳条柔嫩轻盈,像千条万条绿色的丝带。低垂着,在春风中婆娑...
CMIIT ID即无线电发射设备型号核准代码。
大家还关注不要把你的input元素设置为“action”或“submit” - 文章 - 伯乐在线
& 不要把你的input元素设置为“action”或“submit”
大多数的浏览器都有一个严格意义上来说不能算作bug的bug。实际上,浏览器的本意是让你的工作变得更简单,但是如果你(或者其他人)恰好以某种方式(其实是错误的方式)来写HTML代码的话,就会完全触发该问题。特别的,如果你指定input标签的id或者name属性值为“action”或“submit”,你可能就会触发非常隐藏的bug。
关于该“Bug”的介绍
去年我通读了John Resig 和Bear Bibeault著作的《》一书。顺便说一下,如果你想写高效、优雅的javascript代码,这绝对是一本非常棒的书。不管怎么样,在第11章,某些内容吸引了我的注意力。如果你在form表单里有一个拥有id和/或name属性的input元素,那么你可以直接通过form元素的某些属性获取到该input元素,该特性被作者称为是“贪婪的ID”(greedy IDs)。
&form id=&form& action=&url&&
&input type=&text& id=&textboxid& name=&textboxname&&
<form id="form" action="url">&&&&&&<input type="text" id="textboxid" name="textboxname">&&</form>
JavaScript
// Grab the form
var form = document.getElementById('form');
// Reference the text box directly from the form by its ID or name
// -& The input element
form. // -& The input element
// Grab the form&&var form = document.getElementById('form');&&&// Reference the text box directly from the form by its ID or name&&form.textboxid;&& // -& The input element&&form.textboxname; // -& The input element
这真是一个相当酷的想法,但是这并不是很有必要,因为通过元素的id或者name属性来获取元素也是很容易的。而且,要注意一个非常重要的事实:如果form元素的某个属性名和input元素的id/name值一样,那么该form的属性就会被input元素的属性值所覆盖。
如果你的input元素的id/name属性值被设置为了“action”或“submit”,然后你尝试使用javascript控制提交,那么此时就会变得极其悲剧。现在,如果你想知道form表单数据提交 (通过 form.action提交)的URL,或者你只是想通过写js代码的方式来提交(通过form.submit提交),那么你将会分别得到一个错误的值和直接报错。
我从来没想过我会遇到这个问题,但是我还是碰到了。也许解决该问题的最简单的方法是改写你的input,但是不幸的是有时你可能拿不到HTML代码,而有时你根本不会去拿。而且其他的代码也可能依赖于id/name来做一些事情。因此,如果你没法去直接修改HTML代码,这里还有其他的解决方案。
这种解决方案只能解决form表单元素的属性值是函数的情形。任意值不是函数的属性都将不起作用,即使你尝试用javascript代码去动态修改input元素的id/name属性也毫无用处。不管怎么样,重写值是函数的属性(比如submit),从元素对象的原型获取函数,并将该函数以你想执行的form表单元素为运行环境来执行就能解决问题。
&form id=&form& action=&url&&
&input type=&text& id=&submit&&
<form id="form" action="url">&&&&&&<input type="text" id="submit">&&</form>
JavaScript
// Grab the form
var form = document.getElementById('form');
// Try to submit it the normal way
form.submit(); // Nope, that's an error
// Try to submit using the prototype
HTMLFormElement.prototype.submit.call(form); // Yay! It worked!
// Grab the form&&var form = document.getElementById('form');&&&// Try to submit it the normal way&&form.submit(); // Nope, that's an error&&&// Try to submit using the prototype&&HTMLFormElement.prototype.submit.call(form); // Yay! It worked!
我并没有在老版本的浏览器做测试,但是它应该在对较老HTML4支持较好的浏览器上都能正常运行,因为HTMLFormElement最初是在中被指定的。
在书中没有给出解决方案我感到有些惊讶。他们只是多少提到了说我们要避免使用这些ids/names(指action、submit等):
“幸运的是,通过避免使用和标准的属性名冲突的较简单的id值,我们在自己的标记中可以避免这个问题,同时我们鼓励其他人也这么做。特别是id和name的值要避免用submit,这是一个导致让人费解的bug并令人沮丧的问题的常见来源。”
虽然这的确是一个合理的建议,正因如此我把它作为了文章的标题,但这种情况并不总是可以避免的,因此有一种简单的能解决一部分问题的方案总是好的。但无论如何,我希望你永远用不到这种解决方案。愿上帝保佑,祝你编程快乐!
打赏支持我翻译更多好文章,谢谢!
打赏支持我翻译更多好文章,谢谢!
任选一种支付方式
关于作者:
可能感兴趣的话题
关于伯乐在线博客
在这个信息爆炸的时代,人们已然被大量、快速并且简短的信息所包围。然而,我们相信:过多“快餐”式的阅读只会令人“虚胖”,缺乏实质的内涵。伯乐在线内容团队正试图以我们微薄的力量,把优秀的原创文章和译文分享给读者,为“快餐”添加一些“营养”元素。
新浪微博:
推荐微信号
(加好友请注明来意)
– 好的话题、有启发的回复、值得信赖的圈子
– 分享和发现有价值的内容与观点
– 为IT单身男女服务的征婚传播平台
– 优秀的工具资源导航
– 翻译传播优秀的外文文章
– 国内外的精选文章
– UI,网页,交互和用户体验
– 专注iOS技术分享
– 专注Android技术分享
– JavaScript, HTML5, CSS
– 专注Java技术分享
– 专注Python技术分享
& 2016 伯乐在线我一用:&input type=&submit& name=&Submit& value=&登录&&发言,就成了一个按纽???怎么办呢?
Description of your first forum.
21 篇帖子 & 分页:2 / 2 &
由 lnboy & 星期四, 日 13:32
需要写代码实现 把&&&这些特殊字符进行转换成如下形式
&input&type=&submit&&name=&Submit&&value=&登录&&
这里可以帮你转换:/htmlch.php3
dephibbs能够不用转换是 使用了xml里的
&&![CDATA[ &input type=&submit& name=&Submit& value=&登录&& ]]&
而在xsl里是&xsl:value-of select=&test& &/&来解释输出(默认是直接输出文本的html)。
&xsl:value-of select=&test& &disable-output-escaping=&yes&/&则会输出html代码将起显示为按钮。
由 lnboy & 星期四, 日 13:35
呵呵,被delphibbs给解释了,
只好再转换了一下:
&input&type=&submit&&name=&Submit&&value=&登录&&
(可以看出delphibbs没有再进一步转换了,结果让我上面的显示成不是我想要的)
查看这里的源文件,这些特殊字符也是被delphibbs过滤处理了的。
由 kangjiazyx & 星期四, 日 13:44
但我还是不知道应该怎么做?
由 lnboy & 星期四, 日 13:59
在输出之前或者在存如数据库之前对文本中的特殊字符进行替换就可以了
& &re=replace(s,&&&,&&&);
& &re=replace(re,&&&,&&&);
& &re=replace(re,&\n&,&&br&&);
& &re=replace(re,& &,& &);
& &re=replace(re,&'&,&'&);
你搜索一下,网上有相关的正则表达式处理。
我只是看见过,自己还没有实际应用过。
由 无雨 & 星期四, 日 15:28
试一下这种方法
把内容输入框改一下iframe
&SCRIPT LANGUAGE=javascript&
function submitForm(mode){
............................略
frmsubmit.body.value=idContent1.document.body.innerHTML;
frmsubmit.action=&****.jsp?mode=&+
frmsubmit.submit();
&BODY onload=&window_onload();&&
&SCRIPT LANGUAGE=javascript&
var isHTMLMode=
function window_onload(isHTMLMode) { & & & &
if (isHTMLMode)
& & & &idEdit = idContent1.DOM.parentW
idContent1.document.designMode=&On&;
idEdit = idContent1;
& &idEdit.document.open();
& &idEdit.document.write(&&);
& &idEdit.document.close();
&// &idEdit.document.body.innerHTML='&%=###%&';
&iframe width=&100%& id=&idContent1& height=&350&&&/iframe&
&input name=update type=button value=&提交& onClick=&javascript:submitForm('new');& class=&button&&
&input type=&hidden& name=&mode& &
&input type=&hidden& name=&body& &
.............................
由 kangjiazyx & 星期四, 日 15:38
接受答案了.
21 篇帖子 & 分页:2 / 2 &

我要回帖

更多关于 input type submit 的文章

 

随机推荐