2009-05-06 25 views
16
<a onclick ="foo()" href="bar.html" >Link </a> 

<script> 

... 
function foo(){ 
    //I want to know the href property of whoever called me. 
    //something like this.caller.href ?? 
} 

</script> 

Tôi đoán tôi có thể chỉ định tất cả các ID phần tử và sau đó chuyển ID của riêng tôi đến phương thức JS mà tôi đang gọi, nhưng tôi đang tìm cách tốt hơn.Tôi có thể tìm hiểu từ phương thức Javascript, ai yếu tố DOM nào gọi cho tôi?

Trả lời

0

Làm thế nào để chuyển một đối số?

foo(id); 
11
<a onclick="foo(this)" href="bar.html">Link</a> 

Sau đó, JavaScript sẽ là:

function foo(ob) { 
    alert(ob.href); //or whatever you want to happen preferably pass an id 
} 

Sử dụng "này" chọn nếu bạn muốn vượt qua các đối tượng chính nó để hàm.

1

Bạn có thể vượt qua giá trị của href thuộc tính cho hàm khi nó được gọi là:

<a href="http://www.example.com" onclick="foo(this.href)">link</a> 
20

Khi trình duyệt gọi một hàm như là kết quả của một sự kiện DOM, JavaScript chuyển một đối tượng đến chức năng mà trong đó chứa thông tin về sự kiện. Nhưng nó hoạt động hơi khác một chút so với IE. Để làm việc trong tất cả các trình duyệt, foo() nên một * Lập luận (tôi sử dụng e):

function foo(e) { 
    var sender = (e && e.target) || (window.event && window.event.srcElement); 
    //sender is the DOM element which was clicked 
    alert(sender.href); //assumes the clicked element was an <a> 
} 

Dòng đầu tiên sẽ chỉ định "người gửi" giá trị của phần tử đó có nguồn gốc từ sự kiện này trong tất cả các trình duyệt.

Bây giờ, nếu <a>của bạn có chứa phần tử con (ví dụ, một hình ảnh) và là một trong những là yếu tố thực tế nhấp, sau đó yếu tố đó sẽ trở thành "người gửi". Nếu đây là một khả năng, bạn cần phải đi lên DOM từ người gửi đến khi bạn tìm thấy đường link của bạn:

function foo(e) { 
    var sender = (e && e.target) || (window.event && window.event.srcElement); 
    //sender is the DOM element which was clicked 

    var myEle = sender; 

    //find the parent node until we hit the <a> 
    while(myEle.tagName.toUpperCase() != 'A') { 
    myEle = myEle.parentNode; 
    } 

    //myEle is now the <a>. sender is still the originator. 
    alert(myEle.href); 
} 

* Bạn cũng có thể truy cập vào bất kỳ đối số truyền cho hàm, ngay cả khi họ không tuyên bố, bằng cách sử dụng mảng arguments[].

+1

i like shorting trên tirnary đôi khi, bản thân mình ... var người gửi = (window.event && window.event.srcElement) || e.Mục tiêu; – Tracker1

+0

@cresentfresh onclick là ngữ nghĩa sai và cực kỳ không linh hoạt. Xem các kỹ thuật nâng cao tiến bộ. –

2

Quy ước ở đây là này đề cập đến phần tử DOM handler được gọi về. Vì vậy, nếu bạn muốn biết href của liên kết:

function foo() { 
    // Inside foo this will refer to the DOM element if called as an event handler 
    var href = this.href 
} 

Điều đó sẽ làm điều đó.

EDIT: Nếu foo được gọi từ một onclick-handler một cách rõ ràng trong DOM, ví dụ:

<a [...] onclick="foo()"> 

sau đó bối cảnh ban đầu của này sẽ bị mất bên trong của foo. Để khắc phục điều này có thể ràng buộc gọi hàm với bối cảnh ban đầu:

<a [...] onclick="foo.call(this)"> 
+0

Không.

Các vấn đề liên quan