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 相关文章推荐
Javascript中arguments用法实例分析
Jun 13 Javascript
jQuery实现简单下拉导航效果
Sep 07 Javascript
JavaScript如何实现跨域请求
Aug 05 Javascript
详解node HTTP请求客户端 - Request
May 05 Javascript
详解React 16 中的异常处理
Jul 28 Javascript
关于webpack2和模块打包的新手指南(小结)
Aug 07 Javascript
swiper自定义分页器使用方法详解
Sep 14 Javascript
代码详解javascript模块加载器
Mar 04 Javascript
vue弹窗组件的实现示例代码
Sep 10 Javascript
js get和post请求实现代码解析
Feb 06 Javascript
JavaScript设计模式之门面模式原理与实现方法分析
Mar 09 Javascript
Antd表格滚动 宽度自适应 不换行的实例
Oct 27 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下获取上个月、下个月、本月的日期(strtotime,date)
2014/02/02 PHP
PHP获取MySql新增记录ID值的3种方法
2014/06/24 PHP
php生成QRcode实例
2014/09/22 PHP
PHP+原生态ajax实现的省市联动功能详解
2017/08/15 PHP
JQery jstree 大数据量问题解决方法
2010/03/09 Javascript
jQuery.buildFragment使用方法及思路分析
2013/01/07 Javascript
jQuery不间断滚动效果(模拟百度新闻支持文字/图片/垂直滚动)
2013/02/05 Javascript
document.forms[].submit()使用介绍
2014/02/19 Javascript
JavaScript中使用concat()方法拼接字符串的教程
2015/06/06 Javascript
AngularJS 入门教程之HTML DOM实例详解
2016/07/28 Javascript
BootStrap Typeahead自动补全插件实例代码
2016/08/10 Javascript
switch语句的妙用(必看篇)
2016/10/03 Javascript
浅谈使用splice函数对数组中的元素进行删除时的注意事项
2016/12/04 Javascript
微信小程序自定义导航隐藏和显示功能
2017/06/13 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
angular 服务随记小结
2019/05/06 Javascript
20多个小事例带你重温ES10新特性(小结)
2019/09/29 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
2020/05/12 Javascript
[05:39]2014DOTA2国际邀请赛 DK晋级胜者组专访战队国士无双
2014/07/14 DOTA
通过数据库对Django进行删除字段和删除模型的操作
2015/07/21 Python
Python中的探索性数据分析(功能式)
2017/12/22 Python
python爬虫租房信息在地图上显示的方法
2019/05/13 Python
python 实现生成均匀分布的点
2019/12/05 Python
python 基于opencv 实现一个鼠标绘图小程序
2020/12/11 Python
python中re模块知识点总结
2021/01/17 Python
python实现b站直播自动发送弹幕功能
2021/02/20 Python
CSS3 渐变(Gradients)之CSS3 径向渐变
2016/07/08 HTML / CSS
详解HTML5如何使用可选样式表为网站或应用添加黑暗模式
2020/04/07 HTML / CSS
AmazeUI 列表的实现示例
2020/08/17 HTML / CSS
网上蛋糕店创业计划书
2014/01/24 职场文书
企业职业病防治方案
2014/05/29 职场文书
火箭队口号
2014/06/18 职场文书
初中生考试作弊检讨书
2014/12/14 职场文书
解决python绘图使用subplots出现标题重叠的问题
2021/04/30 Python