在 jQuery 中处理多个单击事件，其中顺序很重要

发布于 2024-08-24 09:34:47 字数 1538 浏览 9 评论 0原文

我正在开发一个使用 ajax 的 php 应用程序。在所有我想要被 jQuery 劫持的链接上，我将类 ajaxlink 直接添加到链接中

<a class="someclass ajaxlink" href="somelocation1">goto1</a>
<a class="someclass ajaxlink" href="somelocation2">goto2</a>
<a class="someclass ajaxlink" href="somelocation3">goto1</a>

javascript 看起来像这样

$('.ajax-link').click(function(){get link with ajax});

如果用户启用了 JavaScript，他将通过 ajax 获取页面。特别是我有一个多个页面，所以我有相同的功能来为所有页面生成相同的链接。

现在我的问题出在一页中的一个链接上，我想做一些不同的事情。当 ajax 页面成功返回时，它必须触发另一个函数。现在我有这样的代码。

<div class"specialclass">
    <a class="someclass ajaxlink" href="somelocation1">goto1</a>
    <a class="someclass ajaxlink" href="somelocation2">goto2</a>
    <a class="someclass ajaxlink" href="somelocation3">goto1</a>

    <a class="someclass ajaxlink special-1" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-2" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-3" href="somelocation">goto</a>
</div>

$('.ajax-link').click(function(){get link with ajax});
$('.specialclass .special-1,
   .specialclass .special-2,
   .specialclass .special-3').click(function(){get link with ajax});

此设置是因为我希望同一容器中的正常链接能够正常执行。只有一个特殊链接我想添加另一个点击事件。我认为我无法将此事件添加到正常的单击事件中，因为它只需要在应用程序的一个特定页面中触发。在所有其他页面上，这将是不必要的代码。

然而，此设置产生了错误，因为特殊类单击首先被触发，然后是 ajaxlink 类。必须切换它，只有在 ajaxlink 返回成功时才需要触发。

任何人对此有任何想法。

原文

I am working on a php that application that uses ajax. On all the links where i want to get the link hijacked by jQuery I add the class ajaxlink directly into the link

<a class="someclass ajaxlink" href="somelocation1">goto1</a>
<a class="someclass ajaxlink" href="somelocation2">goto2</a>
<a class="someclass ajaxlink" href="somelocation3">goto1</a>

The javascript looks something like this

$('.ajax-link').click(function(){get link with ajax});

If the user has JavaScript enabled he will get the page trough ajax. One particular i have one multiple pages, so i have the same function to generate the same link for all the pages.

Now my problem is in just one of the links in one page i want to do something different. It has to fire another function when the ajax page return succesfull. Now I have a code like this.

<div class"specialclass">
    <a class="someclass ajaxlink" href="somelocation1">goto1</a>
    <a class="someclass ajaxlink" href="somelocation2">goto2</a>
    <a class="someclass ajaxlink" href="somelocation3">goto1</a>

    <a class="someclass ajaxlink special-1" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-2" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-3" href="somelocation">goto</a>
</div>

$('.ajax-link').click(function(){get link with ajax});
$('.specialclass .special-1,
   .specialclass .special-2,
   .specialclass .special-3').click(function(){get link with ajax});

This setup because i want the normal link that are in the same container to be executed as normal. Only one the special links i want to add another click event. I think i cant add this event to the normal click event, because it only has to fire in one specific page of the application. On all other pages it will be unnecessary code.

This setup however produced errors, because the specialclass click gets fired first, and after that the ajaxlink class. This has to be switched, it only has to fire if the ajaxlink returned a success.

Any one have any ideas on this.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

春夜浅 2024-08-31 09:34:47

您可以在整个过程中重构正常的点击功能，然后执行以下操作：

var normalClick=function(){/*get link with ajax*/};

$('.ajax-link').click(normalClick);
$('.specialClass').click(
  function(){
    normalClick();
    /* special click code */
  }
);

You could refactor your normal click function out of the entire process and do this:

var normalClick=function(){/*get link with ajax*/};

$('.ajax-link').click(normalClick);
$('.specialClass').click(
  function(){
    normalClick();
    /* special click code */
  }
);

回复收藏 0 原文