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 纠正 cleanWhitespace函数
Mar 11 Javascript
jquery随意添加移除html的实现代码
Jun 21 Javascript
jquery学习笔记 用jquery实现无刷新登录
Aug 08 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
Oct 20 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
Sep 25 Javascript
JavaScript把数组作为堆栈使用的方法
Mar 20 Javascript
javascript 闭包详解
Jul 02 Javascript
javascript类型系统 Window对象学习笔记
Jan 07 Javascript
关于Vue.nextTick()的正确使用方法浅析
Aug 25 Javascript
详解ECMAScript typeof用法
Jul 25 Javascript
JavaScript面试中常考的字符串操作方法大全(包含ES6)
May 10 Javascript
微信小程序实现选择地址省市区三级联动
Jun 21 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中使用Oracle数据库(6)
2006/10/09 PHP
php阻止页面后退的方法分享
2014/02/17 PHP
PHP中使用CURL模拟登录并获取数据实例
2014/07/01 PHP
跟我学Laravel之视图 &amp; Response
2014/10/15 PHP
PHP Include文件实例讲解
2019/02/15 PHP
科讯商业版中用到的ajax空间与分页函数
2007/09/02 Javascript
jquery 利用show和hidden实现级联菜单示例代码
2013/08/09 Javascript
javascript 3d 逐侦产品展示(核心精简)
2014/03/26 Javascript
JavaScript中原型和原型链详解
2015/02/11 Javascript
cookie的secure属性详解
2015/04/08 Javascript
jQuery实现类似淘宝网图片放大效果的方法
2015/07/08 Javascript
卸载安装Node.js与npm过程详解
2016/08/15 Javascript
使用JS实现图片展示瀑布流效果的实例代码
2016/09/12 Javascript
Bootstrap表单制作代码
2017/03/17 Javascript
详谈javascript精度问题与调整
2017/07/08 Javascript
Vue ElementUI之Form表单验证遇到的问题
2017/08/21 Javascript
360提示[高危]使用存在漏洞的JQuery版本的解决方法
2017/10/27 jQuery
angular1配合gulp和bower的使用教程
2018/01/19 Javascript
VUE2.0+ElementUI2.0表格el-table循环动态列渲染的写法详解
2018/11/30 Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
2019/09/20 Javascript
关于vue-cli3打包代码后白屏的解决方案
2020/09/02 Javascript
原生js实现购物车
2020/09/23 Javascript
解决vuex改变了state的值,但是页面没有更新的问题
2020/11/12 Javascript
[02:16]卖萌的僵尸 DOTA2神话信使飞僵小宝来袭
2014/03/24 DOTA
python调用短信猫控件实现发短信功能实例
2014/07/04 Python
跟老齐学Python之不要红头文件(1)
2014/09/28 Python
利用python程序生成word和PDF文档的方法
2017/02/14 Python
深入分析python 排序
2020/08/24 Python
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
七年级英语教学反思
2014/01/15 职场文书
《威尼斯的小艇》教学反思
2014/02/17 职场文书
生日寄语大全
2014/04/08 职场文书
2014迎国庆演讲稿
2014/09/19 职场文书
党的群众路线教育实践活动个人整改措施范文
2014/11/04 职场文书
2015圣诞节贺卡寄语
2015/03/24 职场文书
小学运动会通讯稿
2015/07/18 职场文书