Question

我在一个页面上有3个链接。所有人都有css class =＆＃34; suggest_product＆＃34;和一个我需要包含在url中的整数id。我想覆盖你点击时发生的事情。我有一个ajax函数，它会将我记录的一些数据发送到一个url，然后一旦完成，就将页面重定向到原始url。非javascript后备应始终转到原始href。

我的问题是我还没找到如何从点击功能中获取原始网址或#id。该链接有一个图像和一个跨度，并且click事件似乎触发了那些而不是a标签。我想。

不起作用的代码：

$(function(){
   $("a.suggested_product").click(function(e){
        e.preventDefault();
        original_url = e.target.href;
        log_url = "http://domain.com/ajax-controller/"+e.target.id;
        ajaxLogSuggestClick(log_url, original_url)
        return;
   });
});

建议？

Answer 1

$(function(){
   $(".suggested_product").click(function(){

        //notice the use of the `var` keyword to keep variables local
        var original_url = this.href,
            log_url      = "http://domain.com/ajax-controller/" + this.id;

        //do the AJAX request to your server-side script
        $.ajax({
            url     : log_url,
            type    : 'get',
            success : function (serverResponse) {
                //successfull callback, forward user to original_url
                window.location = original_url;
            },
            error   : function () {
                //an error occured, you probably just want to forward the user to their destination
                window.location = original_url;
            }
        });

        //returning false inside a jQuery Event Handler is the same as calling `event.preventDefault()` and `event.stopPropagation()`
        return false;
   });
});

Answer 2

简而言之，您需要替换

e.target.href;

与

$(this).attr("href");

和

e.target.id;

与

$(this).attr("id");

Answer 3

该链接有一个图像和一个跨度，并且点击事件似乎在触发那些而不是标记。

是的，对孩子的点击会冒泡到锚点，因此e.target将引用子元素。但是jQuery会将this设置为绑定事件的元素，所以：

$(function(){
   $("a.suggested_product").click(function(e){    
      e.preventDefault();
      ajaxLogSuggestClick(this.href, "http://domain.com/ajax-controller/"+this.id)
   });
});

此外，不要创建全局变量（除非您需要它们）：您的original_url和log_url未声明为var，因此是全局变量。但它们也是不必要的，所以我在我的代码版本中删除了它们。

Jquery覆盖链接，使用url

3 个答案: