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 相关文章推荐
基于prototype的validation.js发布2.3.4新版本,让你彻底脱离表单验证的烦恼
Dec 06 Javascript
超越Jquery_01_isPlainObject分析与重构
Oct 20 Javascript
JS小功能(列表页面隔行变色)简单实现
Nov 28 Javascript
js操作cookie保存浏览记录的方法
Dec 25 Javascript
jQuery获取checkbox选中的值
Jan 28 Javascript
jQuery实现简单滚动动画效果
Apr 07 Javascript
Mongoose学习全面理解(推荐)
Jan 21 Javascript
JavaScript输出所选择起始与结束日期的方法
Jul 12 Javascript
React组件重构之嵌套+继承及高阶组件详解
Jul 19 Javascript
Openlayers实现扩散的动态点(水纹效果)
Aug 17 Javascript
如何阻止移动端浏览器点击图片浏览
Aug 29 Javascript
vue+echarts+datav大屏数据展示及实现中国地图省市县下钻功能
Nov 16 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 session有效期问题
2009/04/26 PHP
DISCUZ在win2003环境下 Unable to access ./include/common.inc.php in... 的问题终极解决方案
2011/11/21 PHP
mysql,mysqli,PDO的各自不同介绍
2012/09/19 PHP
PHP以指定字段为索引返回数据库所取的数据数组
2013/06/30 PHP
php面向对象中的魔术方法中文说明
2014/03/04 PHP
Laravel ORM 数据model操作教程
2019/10/21 PHP
this[] 指的是什么内容 讨论
2007/03/24 Javascript
javascript 24小时弹出一次的代码(利用cookies)
2009/09/03 Javascript
JS小功能(offsetLeft实现图片滚动效果)实例代码
2013/11/28 Javascript
引入autocomplete组件时JS报未结束字符串常量错误
2014/03/19 Javascript
JQuery工具函数汇总
2015/06/15 Javascript
ASP.NET jquery ajax传递参数的实例
2016/11/02 Javascript
EditPlus中的正则表达式 实战(2)
2016/12/15 Javascript
详解基于angular路由的requireJs按需加载js
2017/01/20 Javascript
基于vue实现swipe轮播组件实例代码
2017/05/24 Javascript
NodeJS自定义模块写法(详解)
2017/06/27 NodeJs
webpack4.0 入门实践教程
2018/10/08 Javascript
javascript实现京东登录显示隐藏密码
2020/08/02 Javascript
Python跳出循环语句continue与break的区别
2014/08/25 Python
Python3爬虫教程之利用Python实现发送天气预报邮件
2018/12/16 Python
windows安装TensorFlow和Keras遇到的问题及其解决方法
2019/07/10 Python
python3实现绘制二维点图
2019/12/04 Python
Matplotlib绘制雷达图和三维图的示例代码
2020/01/07 Python
解决Django中checkbox复选框的传值问题
2020/03/31 Python
python topk()函数求最大和最小值实例
2020/04/02 Python
python实现经典排序算法的示例代码
2021/02/07 Python
JBL美国官方商店:扬声器、耳机等
2019/12/01 全球购物
韩语专业本科生求职信
2013/10/01 职场文书
卫校毕业生自我鉴定
2013/10/31 职场文书
学历公证书范本
2014/04/09 职场文书
《长江之歌》教学反思
2014/04/17 职场文书
竞聘演讲稿精彩开头和结尾
2014/05/14 职场文书
nginx配置proxy_pass中url末尾带/与不带/的区别详解
2021/03/31 Servers
Go各时间字符串使用解析
2021/04/02 Golang
用python自动生成日历
2021/04/24 Python
Mysql使用全文索引(FullText index)的实例代码
2022/04/03 MySQL