<script type="text/javascript" src="/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
  function formAction(){
    alert("此为form标签测试>>>"+$("#text1").val());
  }
  function buttonClick(){
    alert("此为button按钮onclick测试>>>"+$("#text1").val());
  }
</script>
<form action="javascript:formAction()" method="get">
  <input type="text" name="text1" id="text1" value="弹窗测试" />
  <button onclick="javascript:buttonClick()">button</button>
</form>

在form标签中点击button按钮后会先执行onclick操作 然后执行form.submit操作

点击button后结果:

此为button按钮onclick测试>>>弹窗测试
此为form标签测试>>>弹窗测试

<button>标签与<input type="button">标签的更多相关文章

  1. button标签与input type=button标签使用的差异

    button标签和input type=button标签都是html文档中用来表示按钮属性的元素,不过他们在布局和实际使用功能中存在一些差异. 下面将项目中遇到的一些总结如下: 1.属性和布局差异. ...

  2. 【转】解析<button>和<input type="button"> 的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

  3. button与input[type=”button”]的区别

    button与input[type="button"]的区别 特别感谢 @守护晴天 ,指出了博客中不细致不严谨的地方,也让我学到了更多,更多是觉得抱歉,由于自己的不细致可能误导了一 ...

  4. <button>和<input type="button"> 的区别

    <button>标签 定义和用法 <button> 标签定义一个按钮. 在 button 元素内部,您可以放置内容,比如文本或图像.这是该元素与使用 input 元素创建的按钮 ...

  5. input type=file 标签禁止让用户手动输入

    常规的Web应用程序中涉及到文件上传的部分都不可避免地会使用到<input type="file"/>控件,在上传文件的时候通过点击“浏览”按钮,在弹出的文件选择对话框 ...

  6. button,input type=button按钮在IE和w3c,firefox浏览器区别

    在项目中遇到一个问题,是关于点击button按钮会自动刷新的问题.查阅了资料,做以下的整理: button,input type=button按钮在IE和w3c,firefox浏览器区别如下:当在IE ...

  7. input[type="button"]与<button>的区别

    <button>标签  浏览器支持  所有主流浏览器都支持<button>标签.  重要事项:如果在HTML表单中使用button元素,不同的浏览器会提交不同的值.IE将提交& ...

  8. <button>与<input type="button">的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

  9. 解析<button>和<input type="button"> 的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

随机推荐

  1. sendEmail报错:at /usr/share/perl5/vendor_perl/IO/Socket/SSL.pm

    sendEmail发送邮件是出现以下报错: *******************************************************************  Using the ...

  2. python 学习笔记十五 django基础

    Python的WEB框架有Django.Tornado.Flask 等多种,Django相较与其他WEB框架其优势为:大而全,框架本身集成了ORM.模型绑定.模板引擎.缓存.Session等诸多功能. ...

  3. Android 秒级编译 Freeline

    http://mp.weixin.qq.com/s?__biz=MzA4NTQwNDcyMA==&mid=2650662410&idx=1&sn=c654fa7b0cc8c91 ...

  4. 「 JavaScript 篇 」

    一.JavaScript 里有哪些数据类型,解释清楚 null 和 undefined,解释清楚原始数据类型和引用数据类型.比如讲一下 1 和 Number(1)的区别js中有5种数据类型:Undef ...

  5. 读《编写可维护的JavaScript》第11章总结

    这周也是拿到了同程的offer,从此走上了前端之路!感谢我的贵人们.再次纪念一下~! 第11章 不是你的对象不要动 11.1 什么是你的 你的对象:当你的代码创建了这些对象或者你有职责维护其他人的代码 ...

  6. SYSTick 定时器

        CM3 内核的处理器,内部包含了一个 SysTick 定时器,(SysTick 的时钟源自 HCLK 的 8 分频,8个系统时钟周期systick跳一个,即8*1/72M=1/9 us)Sys ...

  7. IIS设置session时长

    打开IIS管理器,选择要设置的session的网站,打开右边窗口的会话状态.选择状态服务器,设置连接字符串,并在服务管理开户状态服务 ASP.NET State Service

  8. 基础笔记10(IO 1.7try-with-resource) 装饰模式

    1.读写的类型分为字节流和字符流,字节流一般是视频音频其他所有的类型都可以. (非文档文件使用字符流易造成未知编码(?)错误) InputStream OutputStream 抽象类 fileInp ...

  9. JQuery_处理元素和浏览器的窗口的尺寸

    一.jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或 ...

  10. phalcon: 多模块多表查找,多表sql

    那么多模块下,如何分页的,如果直接用->from(表名),报错找不到此类,此时要引用model类的全命名空间名称如下: $builder = $this->modelsManager-&g ...