最近发现网页程序中有个BUG,就是在input标签输入框中输入完数据后,直接点击“取消” 按钮的时候、出现网页崩死的情况;

经过小主酸菜我,各种方法的尝试后,找到一个初步可以解决的方案,在这里分享给大家:

首先,分析一下原因:input标签直接离开后,触发的事件是input标签的blur事件;然后直接去点击了取消按钮,执行button事件。

由于js是单线程的所以就出现了问题,现在需要让blur先执行验证,然后在触发click事件。

所以:咱们的解决方案就是,要让他blur事件先验证了,然后再执行button的onclick事件,让js一步一步的来;

给button的onclick事件写一个推迟执行的方法、利用setTimeout();

实例代码如下:

<!--<input type="reset" onclick="BackToMainPage()" value="取消" class="reset tf" id="btnCancel" />   这是原来的取消按钮的代码,下图为改善后。-->

<input type="reset" value="取消" class="reset tf" id="btnCancel" />

 $("#btnCancel").mousedown(
function (e) {
setTimeout('BackToMainPage()', );
});

aaarticlea/png;base64,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" alt="" />

写的不太好,如有其它问题,请指教。

input 的blur事件之后button的onclick事件不执行解决方案的更多相关文章

  1. Asp.Net回车键触发Button的OnClick事件解决方案

    在aspx页面有textbox文本框,还有三个button按钮.启用textbox的TextChanged事件和button的click事件. 问题: 现在在textbox文本框输入完数据按“回车”后 ...

  2. Android:后台给button绑定onClick事件、当返回项目到手机页面时提示是否退出APP

    上一篇文章我们学习了android通过findViewById的方式查找控件,本章将了解button控件,及btton如何绑定控件. 通过android的ui设计工具设计一个登录页面: <Rel ...

  3. ListView中的组件Button的OnClick事件触发时机

    Android开发时,ListView中的组件Button的OnClick事件必须在ListView之外的组件事件触发后才能触发? 此处ListView无OnItemClick事件,而且ListVie ...

  4. 【原】相煎何太急——input的blur事件与button的click事件

    先来一段引子,最近在写手机h5页面,主要是一些登陆注册方面的,最绕不开的就是表单元素. 我想实现的是:在输入框后边有一个删除图标,当输入东西的时候触发事件,显示删除图标,点击该图标会删除之前输入的内容 ...

  5. 点击button触发onclick事件判空后依旧自动跳转

    这是一个前端的问题. 其中判断字符串为空的脚本代码是这样的: var remark = $("#Remark").val(); //判空.注意:var reg = /空格/g; v ...

  6. button的onclick事件给函数传递参数

    ul+='<button onclick="pay(\''+regiId+'\')" >按钮</button>' //此为原生JS页面拼接//此方式的关键就 ...

  7. HTML事件处理程序---内联onclick事件

    HTML事件处理程序绑定方法: <input type="button" value="click me" onclick="show(this ...

  8. form 表单onclick事件 禁止表单form提交

    最近遇到一次处理form数据的过滤,采用了button的onclick事件来检查,发现return false后表单仍然提交了. 于是仔细研究了下onclick.onsubmit.submit集合函数 ...

  9. 解决IE6下a标签的onclick事件里的超链接不跳转问题

    今天遇到个很诡异的问题,就是<a href="javascript:void(0);" onclick="window.location=url"> ...

随机推荐

  1. python2.7安装PIL.Image模块

    这是大家常用的两种安装方法 sudo pip install PIL pip install PIL --allow-external PIL --allow-unverified PIL 如果安装成 ...

  2. android逆向代码分析截图

  3. App Extension

    一.扩展概述 扩展(Extension)是iOS 8中引入的一个非常重要的新特性.扩展让app之间的数据交互成为可能.用户可以在app中使用其他应用提供的功能,而无需离开当前的应用. 在iOS 8系统 ...

  4. golang print struct with key

    https://play.golang.org/p/YMfpuluzef 判断结构体是否为空 打印带attribute(key) 的结构体 package main import ( "fm ...

  5. 使用Django建立网站

    # django-admin startproject csvt01 # cd csvt01 # django-admin startapp blog # vim csvt01/settings.py ...

  6. C++学习笔记 知识集锦(二)

    1. 命名规范 2. 代码格式 3. QString的判断 4. 对象的判空 5. 隐式接口&显式接口 6. vector&string 7. static 8. const 9. v ...

  7. mac常用的命令

    1.递归查找⽂文件内容: grep -r target_string absolute_path 2.移动所有⽂文件(包括隐藏⽂文件): mv * .[^.]* targetDir 3.⽂文件分割合并 ...

  8. [CC]区域生长算法——点云分割

    基于CC写的插件,利用PCL中算法实现: void qLxPluginPCL::doRegionGrowing() { assert(m_app); if (!m_app) return; const ...

  9. js 四舍五入

    举例excel: ROUND 会四舍五入的:ROUNDDOWN 取小数点后两位数据,不管进位问题:ROUNDUP 取小数点后两位数据,只要有第三位小数都会进位的.关键看你取数的要求   在js如果要求 ...

  10. 基于jquery封装通用的控制显示隐藏的方法

    应用场景 在项目中会存在大量这样的需求: 1.选择不同的radio单选框,页面上的部分内容随之显示隐藏 2.选择不同的option下拉框内容,页面上的部分内容随之显示隐藏 如果每次遇到这类需求都单独写 ...