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 学习笔记 选择器之四
Jul 23 Javascript
js获取单元格自定义属性值的代码(IE/Firefox)
Apr 05 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
Mar 04 Javascript
JS简单实现仿百度控制台输出信息效果
Sep 04 Javascript
基于bootstrap实现多个下拉框同时搜索功能
Jul 19 Javascript
Angular简单验证功能示例
Dec 22 Javascript
关于vue的语法规则检测报错问题的解决
May 21 Javascript
又拍云 Node.js 实现文件上传、删除功能
Oct 28 Javascript
Vue匿名插槽与作用域插槽的合并和覆盖行为
Apr 22 Javascript
Vue实现商品分类菜单数量提示功能
Jul 26 Javascript
js原生map实现的方法总结
Jan 19 Javascript
jQuery实现聊天对话框
Feb 08 jQuery
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实现的遍历文件夹下所有文件,编辑删除
2010/01/05 PHP
JS 遮照层实现代码
2010/03/31 Javascript
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
2013/01/09 Javascript
一个简单的JS鼠标悬停特效具体方法
2013/06/17 Javascript
js左侧三级菜单导航实例代码
2013/09/13 Javascript
js获取当前页面的url网址信息
2014/06/12 Javascript
jQuery实现锚点scoll效果实例分析
2015/03/10 Javascript
Javascript中的arguments与重载介绍
2015/03/15 Javascript
Javascript中3个需要注意的运算符
2015/04/02 Javascript
JS实现具备延时功能的滑动门菜单效果
2015/09/17 Javascript
JS中的数组方法笔记整理
2016/07/26 Javascript
在windows上用nodejs搭建静态文件服务器的简单方法
2016/08/11 NodeJs
jquery实现弹窗功能(窗口居中显示)
2017/02/27 Javascript
angularJS之$http:与服务器交互示例
2017/03/17 Javascript
vue-cli脚手架build目录下utils.js工具配置文件详解
2018/09/14 Javascript
js实现unicode码字符串与utf8字节数据互转详解
2019/03/21 Javascript
antd Form组件方法getFieldsValue获取自定义组件的值操作
2020/10/29 Javascript
原生JS运动实现轮播图
2021/01/02 Javascript
Python3.x版本中新的字符串格式化方法
2015/04/24 Python
利用Python批量压缩png方法实例(支持过滤个别文件与文件夹)
2017/07/30 Python
Anaconda多环境多版本python配置操作方法
2017/09/12 Python
Python模拟随机游走图形效果示例
2018/02/06 Python
python中redis查看剩余过期时间及用正则通配符批量删除key的方法
2018/07/30 Python
Python类中的魔法方法之 __slots__原理解析
2019/08/26 Python
Python3如何判断三角形的类型
2020/04/12 Python
详解css3使用transform出现字体模糊的解决办法
2020/10/16 HTML / CSS
以工厂直接定价的传奇性能:Ben Hogan Golf
2019/01/04 全球购物
W Hamond官网:始于1979年的钻石专家
2020/07/20 全球购物
thinkphp5 redis缓存新增方法实例讲解
2021/03/24 PHP
自荐书4要点
2014/01/25 职场文书
2014年迎新年联欢会活动策划方案
2014/02/26 职场文书
祖国在我心中的演讲稿
2014/05/04 职场文书
员工自我评价范文
2015/03/11 职场文书
水电施工员岗位职责
2015/04/11 职场文书
2016年师德师风学习心得体会
2016/01/12 职场文书
小学生法制教育心得体会
2016/01/14 职场文书