JavaScript怎样在删除前添加确认弹出框?


Posted in Javascript onMay 27, 2019

一,【前言】

最近架构组开发的”异常监控平台”,虽说是公司内部基础研发部业务组上百人用的一个系统,但是对一下体验度的提升还是要的,例如,删除是直接删除还是删除之前有一个确认弹出框比较好呢?

答案当然是有确认提示框好,这样可以避免误删.

JavaScript怎样在删除前添加确认弹出框?

二,【详情】 

1,思考方法:

可以添加 js, 或添加一个 function 用一个Ajax.

2,现在情况:

原代码删除是 HTML表单形式,调接口的方式;  网上查了一般都是 onclick方式,这怎么办?

JavaScript怎样在删除前添加确认弹出框?

3,本次解决方案:

(1)  更改 href=”” 换成 onclick=”function()” 触发.

JavaScript怎样在删除前添加确认弹出框?

(2)  onclick=”function()”中 function() 实现:

 JavaScript怎样在删除前添加确认弹出框?

(3)  优化后代码如下:

onclick 代码:

var delHtml = '<a name="trash"style="cursor: pointer" class="glyphicon glyphicon-trash"title="删除" onclick="confirmDel('+id+')"></a>';

function 函数如下 :

functionconfirmDel( id) {
var r=confirm("您确定要删除?")
if (r==true)
{
$.post("/alcf/del",{id:id},function (result) {
window.location.reload();
})
}else {return;}
}

三,【小结】     

圣人有曰:”不怕不知道,就怕不知道!”,先查询,先去实践,在去更改和优化,第一次不一定能做到至善至美,但是一定要去先实践, 多交流,多沟通, 先站在巨人的肩膀上去成长!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery SELECT单选模拟jQuery.select.js
Nov 12 Javascript
js模拟点击事件实现代码
Nov 06 Javascript
Jquery多选下拉列表插件jquery multiselect功能介绍及使用
May 24 Javascript
js单例模式的两种方案
Oct 22 Javascript
jQuery基于扩展简单实现倒计时功能的方法
May 14 Javascript
喜大普奔!jQuery发布 3.0 最终版
Jun 12 Javascript
BootStrap入门教程(二)之固定的内置样式
Sep 19 Javascript
JavaScript 实现 Tab 点击切换实例代码
Mar 25 Javascript
vuedraggable+element ui实现页面控件拖拽排序效果
Jul 29 Javascript
layui的select联动实现代码
Sep 28 Javascript
js实现弹幕飞机效果
Aug 27 Javascript
js canvas实现俄罗斯方块
Oct 11 Javascript
vue项目前端错误收集之sentry教程详解
May 27 #Javascript
了解javascript中变量及函数的提升
May 27 #Javascript
基于vue实现一个禅道主页拖拽效果
May 27 #Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 #jQuery
初学node.js中实现删除用户路由
May 27 #Javascript
jquery实现动态创建form并提交的方法示例
May 27 #jQuery
jquery实现动态改变css样式的方法分析
May 27 #jQuery
You might like
PHP新手上路(三)
2006/10/09 PHP
PHP入门学习笔记之一
2010/10/12 PHP
PHP连接SQLServer2005方法及代码
2013/12/26 PHP
PHP跨平台获取服务器IP地址自定义函数分享
2014/12/29 PHP
PHP实现简单爬虫的方法
2015/07/29 PHP
php实现购物车功能(以大苹果购物网为例)
2017/03/09 PHP
PHP实现的curl批量请求操作示例
2018/06/06 PHP
php常用日期时间函数实例小结
2019/07/04 PHP
PHP unset函数原理及使用方法解析
2020/08/14 PHP
ExtJS PropertyGrid中使用Combobox选择值问题
2010/06/13 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
Javascript中prototype的使用详解
2016/06/18 Javascript
jQuery实现边框动态效果的实例代码
2016/09/23 Javascript
bootstrap模态框消失问题的解决方法
2016/12/02 Javascript
js实现带进度条提示的多视频上传功能
2020/12/13 Javascript
Node.JS更改Windows注册表Regedit的方法小结
2017/08/18 Javascript
详谈Node.js之操作文件系统
2017/08/29 Javascript
vue 实现边输入边搜索功能的实例讲解
2018/09/16 Javascript
微信小程序实现多选删除列表数据功能示例
2019/01/15 Javascript
js动态获取时间的方法分析
2019/08/02 Javascript
[02:47]DOTA2亚洲邀请赛 HR战队出场宣传片
2015/02/07 DOTA
[57:29]Alliance vs KG 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/17 DOTA
Python检测一个对象是否为字符串类的方法
2015/05/21 Python
Python下rrdtool模块的基本使用方法
2015/11/13 Python
python retrying模块的使用方法详解
2019/09/25 Python
Python pandas RFM模型应用实例详解
2019/11/20 Python
Django调用支付宝接口代码实例详解
2020/04/04 Python
python 贪心算法的实现
2020/09/18 Python
详解Python中list[::-1]的几种用法
2020/11/16 Python
美国马匹用品和骑马配件购物网站:Horse.com
2018/01/08 全球购物
泰国时尚电商:POMELO Fashion
2020/03/11 全球购物
造价工程师个人求职信
2013/09/21 职场文书
女子职高个人自荐书
2014/02/01 职场文书
优秀团支部申报材料
2014/12/26 职场文书
中标通知书
2015/04/17 职场文书
pytorch 如何把图像数据集进行划分成train,test和val
2021/05/31 Python