首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >Javascript确认,即使取消也可以运行表单

Javascript确认,即使取消也可以运行表单
EN

Stack Overflow用户
提问于 2018-10-18 05:13:51
回答 3查看 58关注 0票数 -1

所以我有一个删除支付方法的ajax表单处理程序。当用户单击“删除”时,它会显示一个确认弹出窗口。但是,即使用户单击了"cancel“,它仍然会运行表单并删除付款方式。我需要改变什么?

HTML:

<form class="sg-inline-form" method="post" action="">
  <input type="hidden" name="sg_customer_id" value="customerID">
  <input type="hidden" name="sg_card_id" value="cardID">
  <a href="#" class="delete-card" onclick="return confirm('Are you sure?')">Delete</a>
</form>

AJAX:

$('.delete-card').click(function() {
    $('.ajax-loading').show();
    const $form = $(this).parent();
    const customer = $form.find('input[name=sg_customer_id]').val();
    const card = $form.find('input[name=sg_card_id]').val();
    $.ajax({
        url: sg_obj.ajaxurl,
        data: {
            'action': 'sg_delete_payment_source',
            'customer' : customer,
            'card' : card
        },
        success:function(data) {
            // This outputs the result of the ajax request
          $('.ajax-loading').hide();
          $('#ajax-messages').addClass('alert alert-success').html('The payment source has been deleted. <a href=".">Refresh Page</a>');
        },
        error: function(errorThrown){
          $('.ajax-loading').hide();
          $('#ajax-messages').addClass('alert alert-danger').html('An error occurred.');
        }
    });  
    });
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2018-10-18 05:26:30

不要将这两个单独的onClick绑定。您可以通过更改代码来实现功能,如下所示

HTML:

<form class="sg-inline-form" method="post" action="">
  <input type="hidden" name="sg_customer_id" value="customerID">
  <input type="hidden" name="sg_card_id" value="cardID">
  <a href="#" class="delete-card">Delete</a>
</form>

AJAX:

$('.delete-card').click(function() {
    if(confirm('Are you sure?')) {
        $('.ajax-loading').show();
        const $form = $(this).parent();
        const customer = $form.find('input[name=sg_customer_id]').val();
        const card = $form.find('input[name=sg_card_id]').val();
        $.ajax({
            url: sg_obj.ajaxurl,
            data: {
                'action': 'sg_delete_payment_source',
                'customer' : customer,
                'card' : card
            },
            success:function(data) {
                // This outputs the result of the ajax request
              $('.ajax-loading').hide();
              $('#ajax-messages').addClass('alert alert-success').html('The payment source has been deleted. <a href=".">Refresh Page</a>');
            },
            error: function(errorThrown){
              $('.ajax-loading').hide();
              $('#ajax-messages').addClass('alert alert-danger').html('An error occurred.');
            }
        });
    }
});
票数 4
EN

Stack Overflow用户

发布于 2018-10-18 05:28:56

这是因为您正在使用监听onclick和.click事件。当用户点击“取消”时,你可以在if中输入“确认”来停止。

$(function(){
  $("#continues").click(
    function(){
      alert("FIRES EITHER WAY");
  });
  
  $("#stops").click(function(){
    if(confirm("TEST")){
      alert("CONTINUED");
    } else {
      alert("STOPED");
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a id="continues" href="#" onclick="return confirm('Continues')">Continues</a>
<a id="stops" href="#">Stops</a>

票数 1
EN

Stack Overflow用户

发布于 2018-10-18 05:24:44

您没有条件来测试confirm()实际说了什么。this link展示了如何获得实际的confirm()响应,您应该在提交$.ajax请求之前测试响应是真是假

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52863694

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档