javascript - 删除确认对话框在第一次单击时不起作用

标签 javascript jquery

在删除按钮上单击我想显示一个确认对话框并使用这个简单的 plugin 。按钮标记看起来像

<button type="button" class="btn contactDeleteRow" /> 

我的 JS 看起来像

$(document).on('click', '.contactDeleteRow', function() {
$('.contactDeleteRow').easyconfirm();
$("#alert").click(function() {
    // Actions to perform 
});
});

当我第一次单击该按钮时,确认对话框不会出现,但之后所有单击都可以正常工作。有什么想法为什么它在第一次点击时不起作用?以及如何修复它

最佳答案

您需要在点击之前注册该插件,并且仅一次
您在代码中所做的就是在点击后注册它。

$('.contactDeleteRow').easyconfirm(); // register before click

$(document).on('click', '.contactDeleteRow', function() {
    // do something here   
});

// dont register inside a click
$("#alert").click(function() {
    // Actions to perform 
});

这是一个完整的 Html 示例(将 jquery.easy-confirm-dialog.js 放在与 html 文件相同的目录中):

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/blitzer/jquery-ui.css" type="text/css" />
    <script src="jquery.easy-confirm-dialog.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.contactDeleteRow').easyconfirm({ locale: { title: 'This is my title', button: ['No', 'Yes'] } });
            $(document).on('click', '.contactDeleteRow', function () {
                alert('you clicked me');
            });
        })
    </script>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <a href="#" class="contactDeleteRow">
        Click me
    </a>
</body>
</html>

关于javascript - 删除确认对话框在第一次单击时不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29511187/

相关文章:

jquery - 无法在 div 内 float 跨度

javascript - 将日期格式转换为字符串 Javascript

javascript - 在 javascript 中访问 php 变量,反之亦然

javascript - node.js - KOA 服务器 - 转发增强的 POST 请求

javascript - 组合/绑定(bind)多个具有不同 id 或类的标签的更改、点击事件

javascript - 将输入字段中输入的空格实时更改为下划线

javascript - 如何获取这样的图像的src?

javascript - 使用 jQuery 向另一个域发送 GET 请求,不需要 http 响应

php - 根据 url 中的 PHP $GET 在短时间内显示隐藏的 div

javascript - jquery datepicker将日期设置为明天的日期