<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. django之分页、cookie装饰器

    一.分页代码如下 from django.utils.safestring import mark_safe class Page: def __init__(self, current_page, ...

  2. 连接MySQL错误:Can't connect to MySQL server (10060)

    问题原因: 导致些问题可能有以下几个原因: 1.网络不通: 2.服务未启动: 3.防火墙端口未开放: ----防火墙端口未开放的可能性比较大

  3. ubuntu安装(owncloud-docker安装)

    1.源下载地址:http://mirrors.aliyun.com/ubuntu-releases/ ubuntu-16.04-server-amd64.iso 2.在虚拟机上安装完后 (1)查看IP ...

  4. CSS学习心得2

    CSS样式 链接 a:link - 普通的.未被访问的链接 a:visited - 用户已访问的链接 a:hover - 鼠标指针位于链接的上方 a:active - 链接被点击的时刻 当为链接的不同 ...

  5. JS对象深刻理解 - 1

    JavaScript创建对象   JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发 ...

  6. DOCTYPE声明作用及用法详解

    一.浏览器呈现模式和doctype 有的网页是遵循标准而创作的,但也有很多不是.即使你不能创建遵循标准的网页,也希望浏览器根据标准来正确显示那些页.目前,大量网页充斥着大量非标准代码,它们仍能正常地工 ...

  7. linux启动流程及自定义gurb

    linux 启动流程 POST BIOS(boot sequence) 所选择的启动设备次序的MBR中是否有引导程序, ----> MBR(bootloader) 提供内核列表 -------& ...

  8. 【树莓派】 Failed to fetch http://mirrordirector.raspbian.org/raspbian/pool/main/c/chkconfig/chkconfig_11.4.54.60.1debian1_all.deb Could not resolve 'mirrordirector.raspbian.org'

    在安装chkconfig的过程中,遇到如下问题: haochuang@raspberrypi:~/webapp $ sudo apt-get install chkconfigReading pack ...

  9. hightcharts 3d 堆积图下钻

    图片效果 ***************代码部分****************************************************** <!doctype html> ...

  10. Linux系统下配置Tomcat

    1.将下载好的tomcat文件拷贝至/usr/java文件夹中: cp apache-tomcat-7.0.72.tar.gz /usr/java 2.进入/usr/java文件夹: cd /usr/ ...