我的form表单里有好几个Button按钮,每个按钮有不同的功能,可是这些按钮居然都有提交功能,真是把我惊呆了

<button class="btn btn-info " onclick="do_collection()"
title="非Guest用户可收藏">收藏</button>

这个问题困惑了我好几天一直百思不得其解,然后我就去查了一下button按钮的属性,才发现原来是因为我没有指定Button按钮的type属性值,type有三个可选属性:Button,submit,reset,而Button按钮的type属性默认值是submit ,所以在没有指定type属性的情况下,点击Button按钮触发提交form表单就合情合理了,所以要想此按钮不提交,可以指定Button按钮的type属性值为Button

<button class="btn btn-info " type="button"
onclick="do_collection()"
title="非Guest用户可收藏">收藏</button>

  

Button按钮为什么无缘无故会提交form表单?的更多相关文章

  1. 禁止button标签提交form表单,变成普通按钮

    button有个type属性,属性值可为button.submit.reset button=普通按钮,直接点击不会提交表单submit=提交按钮,点击后会提交表单reset=表单复位 当button ...

  2. Ajax提交form表单内容和文件(jQuery.form.js)

    jQuery官网是这样介绍form.js A simple way to AJAX-ify any form on your page; with file upload and progress s ...

  3. 使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

  4. 使用ajax提交form表单,包括ajax文件上传 转http://www.cnblogs.com/zhuxiaojie/p/4783939.html

    使用ajax提交form表单,包括ajax文件上传 前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },&qu ...

  5. ajax提交form表单资料详细汇总

    一.ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单.通过在后台与服务器进行少量数据交换,ajax 可以使网页实现异步更新.这意味 ...

  6. 提交form表单不刷新页面案列

    提交form表单不刷新页面其实很简单的,这里拿上传图片来举列,大家有什么其它的方法也欢迎留言告知与我 <form action="" method="post&qu ...

  7. jquery实现ajax提交form表单的方法总结

    本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一:  function AddHandlingFeeToRefund( ...

  8. jquery的ajax提交form表单方式总结

    方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderServic ...

  9. Ajax提交Form表单的一种方法

    待提交的表单 <form id="updatePublicKey" enctype="multipart/form-data"> <div c ...

随机推荐

  1. 创建ssh 服务的镜像

    $ sudo docker run -ti ubuntu:14.04 /bin/bash #首先,使用我们最熟悉的 「-ti」参数来创建一个容器. root@fc1936ea8ceb:/# sshd ...

  2. 2292: Quality of Check Digits 中南多校 暴力枚举

    #include <cstdio> #include <algorithm> #include <cstring> #include <iostream> ...

  3. NGINX+PHP+ZABBIX,推荐

    https://www.cnblogs.com/liuzhennan/articles/5319280.html

  4. ansible的playbook进行yum批量安装nginx最新版本

    环境:centos7 版本:nginx最新版本 软件: ansible 作用: 进行批量执行不同机器上,进行安装nginx版本 检查脚本是否正确: [root@ansible-test ansible ...

  5. ubuntu 学习

    参考博客:http://www.cnblogs.com/resn/p/5800922.html 在Linux 里一切皆文件 / : 根 查看是否安装了中文支持:locale -a 如果有zh_CN.u ...

  6. windows下简单的缓冲区溢出

    缓冲区溢出是什么? 当缓冲区边界限制不严格时,由于变量传入畸形数据或程序运行错误,导致缓冲区被“撑爆”,从而覆盖了相邻内存区域的数据 成功修改内存数据,可造成进程劫持,执行恶意代码,获取服务器控制权等 ...

  7. Spring Security(二):一、Preface(前言)

    Spring Security is a powerful and highly customizable authentication and access-control framework. I ...

  8. React-安装和配置redux调试工具Redux DevTools

    chrome扩展程序里搜索Redux DevTools进行安装 新建store的时候,进行如下配置. import { createStore, applyMiddleware ,compose} f ...

  9. C# 设置最顶层窗口。TopMostWindow

    code: namespace LOLMM { /// <summary> /// Interaction logic for MainWindow.xaml /// </summa ...

  10. 深入理解Redis高可用方案-Sentinel

    Redis Sentinel是Redis的高可用方案.是Redis 2.8中正式引入的. 在之前的主从复制方案中,如果主节点出现问题,需要手动将一个从节点升级为主节点,然后将其它从节点指向新的主节点, ...