精华内容
下载资源
问答
  • 默认写在form表单的按钮可以自动提交表单,现在要实现效果是点击button按钮调用js函数,再有ajax提交 <button type="button" class="btn btn-sub" onclick="return formSubmit();">提交</button>...

    默认写在form表单里的按钮可以自动提交表单,现在要实现的效果是点击button按钮调用js函数,再有ajax提交

    <button type="button" class="btn btn-sub" onclick="return formSubmit();">提交</button>

     

    function formSubmit()
        {
            // 如果是修改渠道号,原来就有渠道参数,需要将原有的渠道参数初始化进去
            $("#attrTbody").children().each(function(){
                selChannelAttr.push({"name":$(this).children().eq(0).attr("name"), "value":$(this).children().eq(1).text(), "text":$(this).children().eq(0).text()});
            });
    
            $("#channelForm").submit();
    
            return false;
        }

    代码如上,按如下说明改即可

    在formSubmit()函数的最后加上 return false;

    在HTML事件中 οnclick="return formSubmit()"

    转载于:https://www.cnblogs.com/countguo/p/5693943.html

    展开全文
  • 作者:Jakob Nielsen 译者:UCD翻译小组,Link原文地址:http://www.useit.com/alertbox/20000416.html 大在大部分网页表单中,移除重置按钮会有效提升可用性,同样取消按钮对网页意义也不太大。 启发式...

    Article copyright by Jakob Nielsen

    Jakob Nielsen版权所有

    作者:Jakob Nielsen

    译者:UCD翻译小组Link
    原文地址:
    http://www.useit.com/alertbox/20000416.html

     

     

    大在大部分网页表单中,移除重置按钮会有效提升可用性,同样的,取消按钮对网页的意义也不太大。

    启发式的交互设计中最基本的一点是在任何情况下为 用户提供“紧急出口”,离开当前环境。撤销功能是最好的解决方法之一,基本原则只是告诉我们要提供撤销功能但并没有告诉我们怎么做。往往,不同的原则适用 于不同的用户界面:

    • 在基于窗口环境的用户界面中,取消按钮可以让用户通过对对话框的操作,实现探索性的学习。相比较而言,你在老些的系统中下达了错误的命令往往意味 着你将陷入绝境。
    • 在编辑系统中通常会有撤销命令来使文档回复到用户编辑之前的状态。有时,多级撤销和重复命令是很有用但又令人困扰的功能。

    网页试图通过重置和取消按钮来复制以上特性,但用户往往更愿意通过浏览器的后退按钮来离开误入的页面。

    不要使用重置按钮!

    如果去掉所有重置按钮,网页将变为一片净土。这些按钮非但不能帮助用户,还可能伤害到他们。

    重置功能会把用户输入到表单中的所有信息清除掉,但为什么用户要使用这样的功能呢?用户浏览网页的时候会在页面之间频繁转换,他们很少重复访问相同 的表
    单,因此,表单在呈现给用户的时候就是干干净净的。而当用户使用相同的进程重新访问一个表单时,编辑原有的数据往往比重新填写更便捷。

    重置按钮会在以下三个方面伤害用户:

    • 最糟糕的问题是用户想点击提交却误点了重置,他们填写的信息将一下子付之东流。
    • 在表单底部提供两个按钮将混淆交互界面并让用户难以搞清下一步要做什么。用户会把一小部分时间浪费在浏览无用的按钮和决定哪一个才是该 点的上面。
    • 当用户希望在表单中修改已经填写的信息时,面对额外的按钮会做出以下两个选择:
      • 在输入框中修改不正确的内容
      • 点击重置,在清空的输入框中重新填写内容

    额外的选择会迫使用户进行额外的思 考,而使用最佳的交互方式所节省的时间往往小于用户考虑决定使用最常用的方式所花费的时间。这将浪费用户一到两秒的时间来从中取舍,这也是 尽量不要让用户选择的原因。(一秒钟听起来没什么了不起,但它意味着每年一亿美元左右的生产力浪费。)

    让所有输入可撤销

    去掉了重置按钮,我们有必要为用户提供其他的修改错误输入的方式。对于文本框和选择框来说,用户可以随时输入或恢复到最初的状态。

    不幸的是,有些使用了非标准风格的单选框(radio button)和下拉菜单的表单并没有提供回到初始状态的选项,而这是网页设计的典型错误之一。往往,一旦用户选择了一个选项,就没有办法作出“什么都不
    选” 的选择。永远别忘了在单选按钮和下拉菜单中加入明确的默认选项,否则你用户的麻烦就大了。(请参考复选框和单选按钮设计的13条军规

    例外:重复输入表单的重置按钮

    当同时满足以下两个条件时,重置按钮将发挥它的作用:

    • 表单总是由一个用户反复填写
    • 填写的内容每次都有较大差异

    即使某个用户经常使用一个表单,当填入的数据每次都很相似时重置按钮也不是十分必要的。在这种情况下编写原有的数据要比重新来过简单得多。

    保守地使用取消按钮

    网页并不像软件一样拥有对话框,而是一个用户游走于各个页面之间的导航环境。自从超文本导航成为用户的使用习惯,人们开始依赖后退按钮来逃离窘境。 每当用户误入了不想进入的页面,他们就会自然而然地把鼠标放到后退按钮上。

    因为后退是网页浏览中很常规的行为,单独的取消功能也就不是那么重要了。如果用户不喜欢当前的页面,可以肯定,后退按钮就要出场了。

    当用户害怕自己提交了不想提交的信息时,可以为他们提供取消按钮,这样能够提供给他们比直接退出更安全的的感觉。

    在需要多步填写的表单中用户会在超过一个页面上进行输入,这时取消按钮是个不错的选择,因为后退按钮不会撤销之前的输入。

    当然,不能指望用户每次都点取消,应该有一个后端/后台逻辑来处理点击后退来中断多步输入的行为。额外的复杂性是我不推荐在网页中加入复杂应用的原 因之一,更好的办法是使用另一种形式来实现。

    购物车中的移除按钮

    很有必要在购物车中添加特殊的按钮来帮助用户移除商品,我们无法知道用户是不是了解他们能够通过购买“0”件商品来取消购物。(但是反正这个小技巧 也不影响其它用户,所以还是应该实现出来给懂的人用)

    (作者:请参考拙作购物车的可用性,来了解更多表单设计中的规则)

    到底什么时候使用用取消按钮就

    Lisa Padol 问道:

    "当你讨论取消和重置按钮时并没有提及停止(即在载入时停止页面)和刷新按钮,不是吗?

    我觉得这不仅是可以接受的,也很必要为比如下载文件的过程加入取消按钮。"

    她的假定完全正确,浏览器的“停止”按钮很好地加强了用户的控制权。而对于文件传输和其它一些得花好几秒钟的操作也应该这样做。设计师必须给 Applet(网页上的Java应用)和

    其它耗时的设计元素都加上停止功能。



    转载于:https://www.cnblogs.com/kevinzhwl/archive/2010/06/29/1767228.html

    展开全文
  • 很多场景都在使用取消按钮,但并不包括表单表单中并不像以前一样经常使用取消按钮,设计人员开始意识到它们用处不大,且容易产生混淆。是时候对表单中使用取消按钮给出最终结论了。

      很多场景都在使用取消按钮,但并不包括表单。表单中并不像以前一样经常使用取消按钮,设计人员开始意识到它们用处不大,且容易产生混淆。是时候对表单中使用取消按钮给出最终的结论了。
      表单中不用取消按钮的原因有几点。一是使用取消按钮可能会让用户将其与提交按钮混淆,因而导致误操作,在表单中移除取消按钮能完全杜绝上述可能性。取消按钮还可能会传递给用户“后退按钮在表单上不起作用”的意思,后退按钮肯定有效果,但取消按钮给用户的印象是:摆脱表单的唯一方法是点击取消按钮[1]。
      大多数用户想离开页面时都习惯使用后退按钮,由于用户熟练使用该按钮,因此表单页面应保持使用一致性。表单页面应该与网站上的其他页面一致,这样用户就不会困惑为什么不能返回页面[2]。
      取消按钮不能用在表单上,但能用在其它场合。以下两个场景适合使用取消按钮。

    在这里插入图片描述
      第一个场景是确认窗口(confirmation windows)。确认窗口提示用户流程即将开始,用户可以选择继续或取消该流程。此处的取消按钮有用且有效,没有它,用户不得不继续该流程。
      第二种场景是进度条。操作执行过程中会显示进度条,在此期间,用户可以在操作完成之前取消操作。此处的取消按钮有用且有效,没有它,用户就没有办法取消操作。
      取消按钮用得好会给用户带来方便,用的不好就会让用户有种被限制的感觉。不要在表单中使用取消按钮,为了追求优秀的表单设计,是时候彻底和它说再见了。

    原文地址:https://uxmovement.com/forms/killing-the-cancel-button-on-forms-for-good/

    [1]原文:A Cancel button may also communicate to users that the Back button doesn’t work on the form page. Of course, the Back button does work, but the Cancel button gives users the impression that the only way out of the form is through the Cancel button.
    [2]原文:Form pages should function like any other page on a website, so that users won’t get confused as to why they can’t go back a page.

    展开全文
  • 取消form表单里面的按钮的自动提交

    千次阅读 2019-07-08 08:18:16
    我从页面上提交数据常用标签是<form></form>标签,为什么<from>标签能够提交内容呢 ? 因为<form>标签能够进行自动提交,只需要<form>标签里面有一个<button>标签,那么这个&...

    我从页面上提交数据常用的标签是<form></form>标签,为什么<from>标签能够提交内容呢 ?

    因为<form>标签能够进行自动提交,只需要<form>标签里面有一个<button>标签,那么这个<button>标签就会自动带有提交的方法

     

     

    <form>标签里面的<input>标签里面内容到<form>标签Action属性所指向的路径,数据接口对应的是<input>标签对应的name值。

     

     

    然而这种自动提交的方式是会暴露我们服务器的路径的,所以这种方法是一种危险的行为,

     

     

     

    如果实际当中被别人知道服务器路径,那么服务器就很容易遭到入侵,以及被破坏。因此我们要取消<form>标签的自动提交,

     

    可以在该<form>标签里面的<button>的Type属性改为button,那样就可以取消form表单的自动提交了。

     

    这是因为,我们<form>标签会将该标签里面的<button>标签的Type自动改成submit。

     

    所以我们为了不要让表单自动提交,我们就要手动去提交表单了。

     

    这样设置之后那个按钮就没有效果了,它就是一个普通的Button,这时我们就可以手动在这个按钮的点击事件上添加提交方法,来实现表单的数据提交。

     

    我们手动提交表单,我们的的路径不是写在页面标签上的,而是在JavaScript代码中的,这样一来能防止服务器路径的暴露,以及能够一个按钮根据不同的情况把表单数据提交到不同的方法之中去。

     

    JavaScript的提交

     

     

    当给按钮添加事件之后就能实现手动提交了。这样一来既保护了服务器的安全,又能将数据提交到不同的方法之中。

    展开全文
  • 报404错误(如下图1所示)原因是:以下按钮的命名与对象重名即如图2所示。 <td><input type="submit" name="register" value="注册"> <td><input type="reset" name="register" value="重置"> 图2 ...
  • 提交表单 使用< input > 或 <...当单击按钮或图像按钮时,就会提交表单。 submit事件类型仅在表单内提交按钮,或者在文本框中输入文本时按回车键触发。 示例1:单击【提交】按钮后,触发sub...
  • 的表单提交工作很好,除了我有一个单选按钮(首选联系方式),我不知道如何在PHP中添加,以便发送电子邮件.两个单选按钮选项具有相同名称,因此不能用作值.我代码如下.PHP如下:$name = stripslashes($_POST['name...
  • Most Web forms would have improved usability if the Reset button was removed....在大部分网页表单中,移除重置按钮会有效提升可用性,同样取消按钮对网页意义也不太大。It is one of the most...
  • this.$refs['child'].resetFields()在创建赋值时候加上这个 ref需要先定义 如果还未清空。请看prop 有没有加。。ref是去prop里面验证
  • 最近做项目中,需要
  • -- 编辑内容 --&gt; &lt;div id="bjnr" style="display: none;"&gt; &lt;form class="layui-form" action="" id="saveupdateform"&...
  • passSaveShow: [], // 通行组保存和取消的显示隐藏 passEditShow: [], // 通行组编辑显示隐藏 checkedUnLink: [], // 取消关联是否选中 valDate: [], // 有效期显示 pickDateShow: [], // 日期插件隐藏 ...
  • 1. 第一步先在data中定义... show: [], // 保存和取消的显示隐藏 } }; } 2.页面中使用 <div class="name" v-if="show[index]"> 3.重要一步,push到数组中 this.checkList = res.data.data; thi...
  • } //当点击提交时候也会有一样刷新 form.onsubmit = function(e){ var evt = e || event; console.log('aaa'); evt.returnValue = false; } //同样道理阻止输入框默认能输入内容...
  • 该模块大部分都已合并为核心 但是我现在要使用它! 如果您希望在合并之前在SS4中使用它,则可以使用。 修改GridFields详细信息形式以... 可配置用户界面:在顶部(实用程序)或底部(操作)添加按钮。 消除歧义
  • 表单全选取消全选

    2021-01-20 18:42:08
    ①全选和取消全选做法:让下面所有复选框checked属性(选中状态)跟随全选按钮即可 ②下面复选框需要全部选中,上面全选才能选中做法:给下面所有复选框绑定点击事件,每次点击,都要循环查看下面所有复选框是否...
  • 使用场景:需求中需要有一个表单,和两个按钮,vant中的按钮如果在表单内部,就会默认执行submit操作,这时如果另一个按钮想执行别事情,那就要进行一些操作了, 可以把按钮放在表单外面,然后按钮的click事件执行...
  • 这块是新增页面input框验证信息: var myEditValidate; //页面加载完,自动执行定义js代码 $(document).ready(function () { form = layui.form; //判断不为空 myEditValidate = $("#form-program...
  • 弹出层提交表单的js layer .open({ type : 2, title : '添加权限', area : [ '500px', '450px' ], offset : '160px', shadeClose : true, // 点击遮罩关闭 btn : ['保存','取消'], ...
  • 对于表单的按钮以前知道submit和button有区别,但没有深入探索,今天刚好又碰到这个问题,看了下网络上这位朋友已经有现成的总结了,而且比较到位,拿来跟大家分享下(原文地址:... submit是button的一个特例,也是...
  • 表单页通常由多种输入组件和提交按钮组成。输入组件通常包含输入框、下拉列表框、单选框、复选框等等。接下来分别介绍他们逻辑规范和应用场景。相关规范以Axure原型方式整理到网址https://5d2myh.axshare.com一...
  • 问题说明input 标签中的 reset 按钮有重置表单的效果,比如,将 text、password textarea 用户输入的内容清空,将单选、多选等恢复默认选择状态等。一般的表单提交不会用到 reset 按钮,要么提交,要么取消。最近有...
  • 弹框中的取消按钮不起作用,没有进入oncancel函数,右上角的叉号可以正常进入onCancel函数。 <h3>📷 复现步骤 用modalForm单独封装一个表单业务组件。 <h3>🏞 期望结果 <h3>💻 ...
  • BootStrapValidator验证的表单中只可有一个 type="submit" 的按钮。 我这样写了之后 (代码如下) ,点击其它按钮仍会触发验证… 1.错误代码 //示意 <form> ... <button type="submit">提交</...
  • 点击取消按钮的时候,触发对应单击响应事件,这个单击响应事件中主要处理关闭表单页面逻辑,所以会关闭页面,这也正常。但是!打开控制台监听请求会发现,它也会提交表单。 项目应用 项目中有个需求:点击一个...
  • 第一种方法(本质是页面提交时判断,页面上所有按钮提交后,执行那段JS,可以在其中加入按钮判断,实现对多按钮的不用提示功能) 在提交页面的按钮中加入如下代码: Code ClientScriptManagercs=this....

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 595
精华内容 238
关键字:

表单的取消按钮