javascript - 暂停点击事件直到用户输入

标签 javascript jquery

看完this question's answer

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

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

点击当前元素调用后端(通过 ajax)将项目 5 添加到用户购物车。但是如果我想先注入(inject)一个对话框怎么办(仅限 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
});

我不想使用confirmprompt,我主要是想用我自己的 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(); 
 });

}

关于javascript - 暂停点击事件直到用户输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16279970/

相关文章:

jquery - 想在我选中复选框后禁用整个类(class)

javascript - 当页面完成加载时,jquery 滚动事件延迟触发

javascript - 尝试使用 jQuery 选择父 DOM 中的隐藏字段

javascript - jQuery 代码提示和语法高亮

javascript - ESLint - 对象 curl 换行符

javascript - 道场网格 : naviagion

javascript - Vue.js 强制重新渲染包含 v-once 指令的组件

javascript - 修改获取到的JSON数据

javascript - 如何获得字形图标的悬停效果?

javascript - 动画期间布局中断