0

我有一个 jQuery 自动完成设置，对此我有一些特殊要求。

  • 这是“用户配置文件”的自动完成，其中每个自动完成条目由 _renderItem 呈现，如下所示：

用户名：_firstname_lastname_

电话号码：_clickable_phone_number_

这部分工作正常。

  • 选择后，立即导航到不同的页面。我已经使用自定义选择实现了这一点，该选择使用 window.replace 转到不同的页面（该人的个人资料）

这也很好。

  • 最后，“_clickable_phone_number_”链接应该调用另一个 javascript 片段。或者一个简单的超链接

最后一部分是我遇到问题的地方。由于我在选择后立即导航到不同的页面，因此我无法弄清楚如何“防止”此操作。

我可以将 .live 添加到 _clickable_phone_number_ 并运行一些 JS，但我无法停止导航到个人资料页面。

我希望我很清楚。如果没有，我可以进一步解释。

谁能帮助我实现这一目标？基本上，我如何从自定义呈现的 HTML 中进行超链接，尽管有一个导航到不同页面的自定义 select()。

编辑：由于代码片段可能会说清楚，这就是我的意思：

我的 jQuery 自动完成有一个选择，像这样：

$('#input').autocomplete({ source: users, minLength: 3,
 select: function(event, ui) 
{ window.location.replace("/profile.asp?id=" + ui.item.value); }

}).data("autocomplete")._renderItem = function (ul, item) { .. }

每个自动完成渲染元素的 HTML：

<div class=".ui-menu">
<div class="name">FirstName LastName</div>
<div class="phone">12345</div>
</div>

我有这样的现场活动设置：

$('.phone').live("click", function() { callPhone($(this).html()); return false; }

4

1 回答 1

1

你试过使用http://api.jquery.com/event.stopPropagation/

您必须稍微更改您的代码，在公开活动中连接您的电话链接，而不是使用实时。

$('#input').autocomplete({ 
     source: users, 
     minLength: 3,
     select: function(event, ui){ 
         window.location.replace("/profile.asp?id=" + ui.item.value); 
     },
     open: function(event, ui){
          $('.phone').click(function(e) { 
              e.stopPropagation();
              callPhone($(this).html()); 
              return false; 
           });
     }
 }).data("autocomplete")._renderItem = function (ul, item) { .. }

您不能再使用 .live 的原因是因为 .live 事件直到它们一直冒泡到文档时才会触发，因此您无法停止任何事情。

我没有对此进行测试，但它应该可以工作。

于 2012-07-26T19:26:43.860 回答