Question

我似乎无法找到我在这里尝试做的例子，但我确信这是可能的。

请考虑以下事项：

<div id="main_nav">
    <a href="/url/">LINK</a>
    <a href="/url/">LINK</a>
    <a href="/url/">LINK</a>
    <a href="/url/">LINK</a>
</div>

如果在link之后点击#main_nav内的link之后如何运行某个功能？

以下功能不起作用，因为在运行该功能之前会遵循链接。

$('#main_nav a').click(function() {
    // Some Function
});

编辑

我实际上是在点击链接时尝试使用JQuery cookie插件清除cookie。我不确定这是否相关。

清除Cookie代码为：

$.cookie('TMMenu', null);

TMMenu是正确的名称，插件已加载。

编辑

对不起大家。问题实际上是JQuery Cookie plugin documentation。

$.cookie('TMMenu', null);

如自述文件中所述似乎不起作用。这样做：

$.cookie('TMMenu', null, { path: '/', expires: -5 });

Answer 1

更新：重新编辑：我看不出除下面＃1以外的任何其他原因。

我可以想到这个问题的两个答案：

您在#main_nav a元素存在之前运行jQuery代码，并且没有连接事件处理程序。将您的脚本放在HTML文件的底部，就在结束</body>标记之前，或使用ready callback。
您正在处理程序中执行异步操作，而不是看到它发生。这是因为只要事件处理程序返回，就会跟随链接 - 即使你的处理程序启动了一些异步操作。

以下是如何修复第二个（如果你把它放在最后或ready处理程序中）：

$('#main_nav a').click(function(event) {
    // Remember the link href
    var href = this.href;

    // Don't follow the link
    event.preventDefault();

    // Do the async thing
    startSomeAsyncThing(function() {
        // This is the completion callback for the asynchronous thing;
        // go to the link
        window.location = href;
    });
});

（Live copy | source）

Answer 2

这是你如何做到的。如果在单击处理程序回调中调用event.preventDefault，则会阻止默认操作。然后，通过Javascript关注该链接，只需使用window.open(url)或window.location = url。

普通的Javascript示例

document.querySelector('#main_nav a').addEventListener('click', function (event) {
  // Do something before following the link 

  // Get url from the target element (<a>) href attribute
  var url = event.target.href;

  // Open the url in the current window. Set to "_blank" instead of "_self" to open in a new window.
  window.open(url, '_self');

  // Prevent default action (e.g. following the link)
  event.preventDefault();
});

jQuery示例

$('#main_nav a').click(function (event) {
  // Do something before following the link 

  // Get url from the <a> href attribute
  var url = $(this).attr('href');

  // Open the url in the current window. Set to "_blank" instead of "_self" to open in a new window.
  window.open(url, "_self");

  // Prevent default action (e.g. following the link)
  event.preventDefault();
});

有关window.open和window.location之间差异的详情，请参阅MDN。

运行功能然后按链接

2 个答案:

普通的Javascript示例

jQuery示例