0

我想解决以下情况：

我有一个链接，它有一个点击事件（它做了一些 ajax 操作）。单击操作是默认的 Rails，它将执行远程操作（执行 javascript）。当使用以下 html 结构单击 li 元素时，我想在单击事件上调用它：

<li>
   <img src="images/img.png" />
   <a href="/remote/path" data-remote="true">Link</a>
</li>

点击 li 元素应该触发链接上的点击事件并调用其他一些函数（在 li 元素上设置活动类）。

问题是： 1. 如果我在 li 上绑定 click 事件并在链接上调用 click 事件，会导致死循环 2. 如果我在链接上放置 stopPropagation() ，它不会调用原始函数，这执行远程请求

对此最优雅的解决方案是什么？

这是我目前拥有的jcode：

$(document).ready(function() {
    $("#some_list a").click(function(e) {
        alert("action on a");
        e.stopPropagation();
    });

    $("#some_list li").click(function(e) {
        alert("call some function");
        $(this).find('a').trigger("click");
    });
});

这不会导致递归循环，但会阻止我想在链接上触发的默认操作（由 rails 或 ujs 库设置）。

我想我必须在链接上的最后一个操作之后更改链接上的点击操作和 stopPropagation() 的顺序？

或者也许有一些更好的解决方案来重组 HTML 并自己调用远程函数？

感谢帮助

4

1 回答 1

0

您也可以执行 window.location = 'anyurl' 或 ajax。尝试这样的事情

$(function(){
 var myobj = {
 clickedLi: function(){
      alert('clicked on li');
      return this; 
 },
 sendAnchor: function(url){
    alert(url);
    return this;
 }                                   
};

$('ul').on('click', 'li', function(e){
e.preventDefault();
myobj.clickedLi().sendAnchor($(this).find('a').attr('href'));

});
});

这是工作示例 http://jsbin.com/oVAWEdob/2/edit

于 2013-11-21T18:27:13.807 回答