暂停单击事件，直到用户输入

Pause a click event until user input

本文关键字：用户 输入 单击 事件 暂停      更新时间：2023-09-26

看完这个问题的答案

我想知道如何构建一个preventDefault/stopPropagation依赖于用户点击事件，例如:

<html>
   <a data-handler="add_to_cart" data-item_id="5">Click</a>
</html>

单击当前调用后端(通过ajax)的元素，将item 5添加到用户购物车中。但如果我想先注入一个对话框(仅限javascript)

var template = '' +
    '<div class="dialog">' +
        '<p>Really add this item?</p>' +
        '<button>Yes</button>' +
        '<button>No</button>' +
    '</div>'
$(a).click(function(){
    # open the dialog template
    # if the correct button is clicked continue the default event
});

我不想使用confirm或prompt，我基本上是在寻找一种方法来实现他们的功能与我自己的html对话框

您可以阻止传播并从对话框中重新调用click()方法，并请求传播

var template = '' +
    '<div class="dialog">' +
        '<p>Really add this item?</p>' +
        '<button class=correctbutton>Yes</button>' +
        '<button>No</button>' +
    '</div>'
$(a).click(function(){
    if(window.correctButtonClicked){
     return true;//continue propagation
    }
    window.clickedA=a // store current clicked object
    openDialog() 
    return false; //stop propagation
});
function openDialog(){
 //Make a dialog from the template
 $('.correctbutton').click(function(){
      window.correctButtonClicked=true;
      $(window.clickedA).click(); 
 });
}

您有几个选项来完成此操作。我建议的两种方法是重写prompt方法(参见这里和这里关于重写和更改外观)，或者创建自己的对话框并监视其上的按钮。

覆盖:

function prompt() { 
    //Insert your HTML, show the dialog
}

监视另一次点击:

$('#someOtherButton').click(function(){
    //Do what you want
});

我建议简单地重写prompt()。

相关文章：