Question

目标

当用户单击元素（使用class =“menu”）时，不应执行默认操作。应向用户显示带有选项的菜单。单击选项后，应执行默认操作。

问题

首先停止原始点击事件是非常有问题的，因为在此之后似乎无法恢复“默认行为” - 有没有办法只是延迟事件直到用户点击菜单项？

示例

我想要发生的事情：点击链接。菜单附加到正文。单击菜单选项。现在执行原始单击的默认行为（这意味着触发最初单击的链接的单击事件并重定向到example.com）。

的jsfiddle

HTML，JS和CSS在这里： http://jsfiddle.net/arex1337/Tjwmx/

PS：如果你想知道我需要什么功能，这里有一些关于我想到的应用程序的草率和写得不好的想法：www。 scribd.com / doc / 39573220 / MyJsApp

Answer 1

这是不可能的;你需要模拟代码中的默认行为。

您可以将location.href设置为链接的href。

Answer 2

这很容易实现，看看这个： Quick modification of code from question

// create container for url of clicked link 
var event_href = {};

function createMenu(options) {
    $ul = $('<ul></ul>');
    $ul.append('<li class="menu-header">'+options.header+'</li>');
    for (var $i = 0; $i < options.choices.length; $i++) {
        $ul.append('<li class="menu-item">'+options.choices[$i]+'</li>');
    }
    return $ul;
}

function resumeClick(){
    window.location.href = event_href;
}

$('.menu').click('click', function(e) {
    // save event data
    event_href = e.currentTarget.href;
    e.preventDefault()
        $('#placeholder ul').remove();
    createMenu({
        header: 'Choose something',
        choices: ['Item 1', 'Item 2', 'Item 3']
    }).appendTo('#placeholder');
    // init listeners on menu items with callbacks == resume function
    $('.menu-item').click('click', function(){
    resumeClick();})
});

当用户单击元素时：阻止默认操作，显示菜单，然后在单击菜单时恢复默认操作

2 个答案: