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 代码也可以变得优美的实现方法
Jun 22 Javascript
JS来动态的修改url实现对url的增删查改
Sep 05 Javascript
javascript的switch用法注意事项分析
Feb 02 Javascript
使用jQuery在移动页面上添加按钮和给按钮添加图标
Dec 04 Javascript
AngularJS实现表单手动验证和表单自动验证
Dec 09 Javascript
jQuery插件easyUI实现通过JS显示Dialog的方法
Sep 16 Javascript
jQuery中$.ajax()方法参数解析
Oct 22 Javascript
react性能优化达到最大化的方法 immutable.js使用的必要性
Mar 09 Javascript
微信小程序实现长按删除图片的示例
May 18 Javascript
vue 实现特定条件下绑定事件
Nov 09 Javascript
Vue+ElementUI使用vue-pdf实现预览功能
Nov 26 Javascript
原生JS实现留言板
Mar 26 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+MYSQL的文章管理系统(一)
2006/10/09 PHP
PHP中使用sleep函数实现定时任务实例分享
2014/08/21 PHP
PHP register_shutdown_function()函数的使用示例
2015/06/23 PHP
ThinkPHP2.x防范XSS跨站攻击的方法
2015/09/25 PHP
Laravel框架实现发送短信验证功能代码
2016/06/06 PHP
php 人员权限管理(RBAC)实例(推荐)
2017/05/24 PHP
javascript让setInteval里的函数参数中的this指向特定的对象
2010/01/31 Javascript
js onkeypress与onkeydown 事件区别详细说明
2012/12/13 Javascript
在javascript中对于DOM的加强
2013/04/11 Javascript
Js控制弹窗实现在任意分辨率下居中显示
2013/08/01 Javascript
利用jquery写的左右轮播图特效
2014/02/12 Javascript
使用jquery选择器如何获取父级元素、同级元素、子元素
2014/05/14 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
2016/05/10 Javascript
js动态生成form 并用ajax方式提交的实现方法
2016/09/09 Javascript
jQuery Validate 校验多个相同name的方法
2017/05/18 jQuery
JavaScript中立即执行函数实例详解
2017/11/04 Javascript
Vue项目中设置背景图片方法
2018/02/21 Javascript
jquery引入外部CDN 加载失败则引入本地jq库
2018/05/23 jQuery
layui 实现表格某一列显示图标
2019/09/19 Javascript
vue项目中常见问题及解决方案(推荐)
2019/10/21 Javascript
利用vue3+ts实现管理后台(增删改查)
2020/10/30 Javascript
Python新手们容易犯的几个错误总结
2017/04/01 Python
Python实现备份MySQL数据库的方法示例
2018/01/11 Python
Tensorflow 合并通道及加载子模型的方法
2018/07/26 Python
python使用PIL和matplotlib获取图片像素点并合并解析
2019/09/10 Python
numpy库ndarray多维数组的维度变换方法(reshape、resize、swapaxes、flatten)
2020/04/28 Python
Django 如何使用日期时间选择器规范用户的时间输入示例代码详解
2020/05/22 Python
Python实现打包成库供别的模块调用
2020/07/13 Python
浅谈CSS3中的变形功能-transform功能
2017/12/27 HTML / CSS
里程积分管理买卖交换平台:Points.com
2017/01/13 全球购物
建筑施工实习自我鉴定
2013/09/19 职场文书
医务人员医德考评自我评价
2015/03/03 职场文书
2016优秀教师先进个人事迹材料
2016/02/25 职场文书
Redis Stream类型的使用详解
2021/11/11 Redis
MongoDB支持的索引类型
2022/04/11 MongoDB
使用Python通过企业微信应用给企业成员发消息
2022/04/18 Python