Câu hỏi gọi hàm javascript trên nhấp siêu liên kết


Tôi đang tự động tạo một siêu liên kết trong mã c # phía sau tệp ASP.NET. Tôi cần gọi hàm JavaScript khi nhấp vào ứng dụng khách. làm thế nào để tôi thực hiện điều này?


76
2017-08-12 12:32


gốc


có thể trùng lặp Làm thế nào để sử dụng một liên kết để gọi Javascript? - Trilarion


Các câu trả lời:


Neater vẫn còn, thay vì typical href="#" hoặc là href="javascript:void" hoặc là href="whatever", Tôi nghĩ điều này có ý nghĩa hơn nhiều:

var el = document.getElementById('foo');
el.onclick = showFoo;


function showFoo() {
  alert('I am foo!');
  return false;
}

<a href="no-javascript.html" title="Get some foo!" id="foo">Show me some foo</a>

Nếu Javascript không thành công, có một số phản hồi. Hơn nữa, hành vi thất thường (nhảy trang trong trường hợp href="#", truy cập cùng một trang trong trường hợp href="") bị loại bỏ.


118
2017-08-12 12:40



+1 Đây là câu trả lời không phô trương duy nhất. +100 nếu tôi có thể. - James
@Lewis, vâng, lý tưởng là <a> thẻ sẽ không được sử dụng cho cuộc gọi js thuần túy, nhưng tiếc là các trình duyệt cũ hơn không hỗ trợ: di chuột qua các phần tử không liên kết. Vì vậy, các liên kết thường được sử dụng để kích hoạt các sự kiện js. - Chris Van Opstal
@ Chris - Tôi không chắc chắn bạn có được điểm của tôi Chris. Tôi khuyên bạn không nên sử dụng <a href="#"> Không làm gì </a> và thay vào đó hãy sử dụng <a href="a/link/somwhere.html"> Làm điều gì đó </a> và sau đó sử dụng tăng cường tiến bộ để ghi đè lên href. Đây là giải pháp sạch nhất. Neo là tốt, nhưng họ nên làm SOMETHING nếu javascript bị vô hiệu hóa - hoặc vì một lý do nào đó (theo IE6) một số javascript đã phá vỡ trước khi trình xử lý được tạo và gán. Bằng cách này, tất cả người dùng của bạn đều hài lòng. - Lewis
Không làm việc cho tôi, chỉ tự động thực hiện chức năng onclick khi tải trang. Điều này cũng có vẻ giống như một cơn ác mộng nơi mà khả năng tiếp cận có liên quan. - Shawn Solomon
Điều này không hoạt động, nó chỉ dẫn bạn đến url href. - poepje


Câu trả lời đơn giản nhất là ...

<a href="javascript:alert('You clicked!')">My link</a>

Hoặc trả lời câu hỏi gọi hàm javascript:

<script type="text/javascript">
function myFunction(myMessage) {
    alert(myMessage);
}
</script>

<a href="javascript:myFunction('You clicked!')">My link</a>


46
2017-09-11 23:54



Bạn là một phước lành được gửi xuống để giúp các lập trình viên không phải là javascript. cảm ơn Jayden! - Fattie
Điều này dường như không hoạt động trong firefox - Anthony
Anthony nó có vẻ làm việc tốt trong firefox. - Jayden Lawson


Với tham số onclick ...

<a href='http://www.google.com' onclick='myJavaScriptFunction();'>mylink</a>

23
2017-08-12 12:35





Câu trả lời của JQuery. Kể từ khi JavaScript được phát minh để phát triển JQuery, tôi cho bạn một ví dụ trong JQuery làm điều này:

<div class="menu">
    <a href="http://example.org">Example</a>
    <a href="http://foobar.com">Foobar.com</a>
</div>

<script>
jQuery( 'div.menu a' )
    .click(function() {
        do_the_click( this.href );
        return false;
    });

// play the funky music white boy
function do_the_click( url )
{
    alert( url );
}
</script>

13
2017-08-12 13:28



JavaScript được phát minh để phát triển jQuery? Đó là một cái mới! - palswim
Điều này giống như đọc rằng Lego được phát minh để xây dựng Lego Batman. - Shawn Solomon
@ ShawnSolomon Tôi rất vui vì chúng tôi đồng ý :) - elcuco
@elcuco, tuyệt vời mỉa mai! + 'd :) Long Live JQuery - Zuul


Lý tưởng nhất là tôi sẽ tránh tạo ra các liên kết trong bạn mã đằng sau hoàn toàn như mã của bạn sẽ cần biên dịch lại mỗi khi bạn muốn thực hiện một thay đổi để 'đánh dấu' của mỗi liên kết. Nếu bạn phải làm điều đó tôi sẽ không nhúng javascript của bạn 'cuộc gọi' bên trong HTML của bạn, đó là một thực hành xấu hoàn toàn, đánh dấu của bạn nên mô tả tài liệu của bạn không phải những gì nó làm, thats công việc của javascript của bạn.

Sử dụng một cách tiếp cận mà bạn có một id cụ thể cho mỗi phần tử (hoặc lớp nếu chức năng phổ biến của nó) và sau đó sử dụng Tăng cường tiến bộ để thêm trình xử lý sự kiện, chẳng hạn như:

[c# example only probably not the way you're writing out your js]
Response.Write("<a href=\"/link/for/javascriptDisabled/Browsers.aspx\" id=\"uxAncMyLink\">My Link</a>");

[Javascript]  
document.getElementById('uxAncMyLink').onclick = function(e){

// do some stuff here

    return false;
    }

Bằng cách đó, mã của bạn sẽ không bị phá vỡ cho người dùng bị vô hiệu hóa JS và nó sẽ có một mối quan tâm rõ ràng.

Hy vọng đó là sử dụng.


4
2017-08-12 12:52



Tại sao C #? Tại sao không chỉ <a href="/link/for/javascriptDisabled/Browsers.aspx" id="uxAncMyLink">My Link</a>? - Mahmoodvcs


Tôi thích sử dụng phương pháp onclick hơn là href cho siêu liên kết javascript. Và luôn sử dụng cảnh báo để xác định giá trị nào bạn có.

<a href='#' onclick='jsFunction();alert('it works!');'>Link</a>

Nó cũng có thể được sử dụng trên các thẻ đầu vào ví dụ.

<input type='button' value='Submit' onclick='jsFunction();alert('it works!');'>


4
2017-08-12 13:56





Tôi thường khuyên bạn nên sử dụng element.attachEvent (IE) hoặc element.addEventListener (các trình duyệt khác) để thiết lập sự kiện onclick trực tiếp như sau này sẽ thay thế bất kỳ trình xử lý sự kiện hiện có nào cho phần tử đó.

attachEvent / addEventListening cho phép tạo nhiều trình xử lý sự kiện.


2
2017-08-12 13:14





Sử dụng onclick Thuộc tính HTML.

Các onclick xử lý sự kiện chụp một   sự kiện nhấp chuột từ chuột của người dùng   trên phần tử mà    onclick thuộc tính được áp dụng. Điều này   hành động thường dẫn đến cuộc gọi đến   phương pháp kịch bản như JavaScript   chức năng [...]


1
2017-08-12 12:38