如何从<a> tag using jquery</a>获取完整网址

时间:2014-01-27 12:25:37

标签: php jquery url redirect undefined

我收到通知div。当有人单击其中一个链接时,通知的数量将会更改,之后用户将被重定向到他单击的链接。这是div内的php脚本。

<?php
 while($row = stmt->fetch(PDO::FETCH_OBJ))
 {
 echo "<p><a href='http://example.com/blog/index.php?t_id=".$t_id."&c_id=".$c_id."'>".$title."</a></p>";
 }
?>

我在div

中使用了以下Jquery
<script>
 $('p').click(function(event){
 event.preventDefault();

 $.ajax({
 type: "POST",
 url: "http://www.example.com/change_notification.php"
 })
 .done(function( msg ) {

 $("#changed_notification_value").text( msg );
 var n_url = $('a', this).attr('href');
 window.location.href = n_url;

 });
});
</script>

通知数量已成功更改,但在尝试重定向时,n_url的值显示为未定义。

4 个答案:

答案 0 :(得分:7)

我认为使用this时存在范围问题。你可以做这样的事情来解决问题。在发出ajax请求之前获取n_url

$('p').click(function (event) {
    event.preventDefault();
    var n_url = $('a', this).attr('href');

    $.ajax({
        type: "POST",
        url: "http://www.example.com/change_notification.php"
    }).done(function (msg) {

        $("#changed_notification_value").text(msg);
        window.location.href = n_url;
    });
});

答案 1 :(得分:2)

试试这个

var n_url = $(this).find('a').attr('href');

答案 2 :(得分:2)

试试这个:

   var n_url = $(this).find("a").attr('href');
     window.location.href = n_url;

答案 3 :(得分:1)

this与其他语言不同。当不在函数内部时(想想全局空间)this引用当前浏览器的Window对象。默认情况下,新功能将创建为Window的子项。

例如;

function foo() {
    return this;
}

实际上与Window.foo = function() { return this; }相同(除非浏览器处于严格模式)。

因此,当您致电foo()时,以下情况属实。

foo() === window;   // True, because foo() returns this which is window.

因为默认情况下this指的是函数绑​​定的对象。您可以通过将函数绑定到其他对象来更改this的默认值。

var o = {
    x: 99,
    foo: function() {
        return this.x;
    }
};

console.log(o.foo());   // will output 99

将函数绑定到对象时无关紧要。如本例所示。

var a = {
    x: 99
};

var b = {
    x: 77
};

function foo() {
    return this.x;
}

a.f = foo;
b.f = foo;

console.log(a.f());   // will output 99
console.log(b.f());   // will output 77

在上面的示例中,函数foo是相同的,但this会根据使用哪个绑定对象引用进行更改。

那么DOM事件发生了什么?

该函数绑定到DOM元素,这是一个Javascript对象。所以this指的是触发事件的对象。如果相同的函数绑定到多个元素,则甚至this始终指的是触发该功能的那个。

现在回来看你的源代码和问题。您在this函数中使用.done(function(msg){....})。 jQuery已将ajax对象绑定到函数,以便this引用该对象。

您可以使用this功能更改bind()所指的内容。 bind允许您更改绑定到函数的对象,以便this引用该对象。

$('p').click(function(event){
    event.preventDefault();
    $.ajax({
        type: "POST",
        url: "http://www.example.com/change_notification.php"
    }).done(function( msg ) {
        $("#changed_notification_value").text( msg );
        var n_url = $('a', this).attr('href');
        window.location.href = n_url;
    }.bind(this));
});

上面,我没有更改您的源代码,只是将.bind(this)添加到function(msg){...}.bind(this)的末尾。对象this引用函数外部是触发事件的DOM元素,并通过将其绑定到done的回调函数,您的源代码现在应该可以正常工作。