Thêm một hàm onclick để chuyển đến url trong JavaScript?


100

Tôi đang sử dụng JavaScript nhỏ lạ mắt này để đánh dấu một trường khi người dùng di chuột qua nó. Bạn có thể vui lòng cho tôi biết nếu có cách nào để thêm một onclickhàm sẽ hoạt động như một liên kết và đi đến một URL không?

<script>
         $(function() {
            $('tr').hover(function() {
                $(this).css('background-color', '#eee');
                $(this).contents('td').css({'border': '0px solid red', 'border-left': 'none', 'border-right': 'none'});
                $(this).contents('td:first').css('border-left', '0px solid red');
                $(this).contents('td:last').css('border-right', '0px solid red');
            },
            function() {
                $(this).css('background-color', '#FFFFFF');
                $(this).contents('td').css('border', 'none');
                $('a#read_message.php').click(function(){ URL(); });
            });
        });
        </script>

Làm thế nào để có được giá trị url, nó là một liên kết trong một trong những tế bào bảng hoặc làm tất cả họ đều đi đến cùng một URL
Renon Stewart

2
Bạn có một id khá lạ ở đó '# read_message.php'?
Alex Gill

Câu trả lời:


168

Thử

 window.location = url;

Cũng sử dụng

 window.open(url);

nếu bạn muốn mở trong một cửa sổ mới.


129

Đơn giản chỉ cần sử dụng cái này

onclick="location.href='pageurl.html';"

9
Thao tác này sẽ mở liên kết trong cùng một cửa sổ, trong khi câu trả lời được chấp nhận sẽ mở ra trong một cửa sổ mới. Tôi thích cách tiếp cận của câu trả lời này
Hamman Samuel

33

Trong jquery để gửi người dùng đến một URL khác, bạn có thể thực hiện như sau:

$("a#thing_to_click").on('click', function(){
     window.location = "http://www.google.com/";    
});

cách này cũng sẽ hiệu quả nhưng ở trên là cách mới hơn, đúng hơn để thực hiện những ngày này

$("a#thing_to_click").click(function(e){
         e.preventDefault();
         window.location = "http://www.google.com/";    
});


8

HTML

<input type="button" value="My Button" 
onclick="location.href = 'https://myurl'" />

MVC

<input type="button" value="My Button" 
onclick="location.href='@Url.Action("MyAction", "MyController", new { id = 1 })'" />

6

Nếu bạn muốn mở liên kết trong một tab mới, bạn có thể:

$("a#thing_to_click").on('click',function(){
    window.open('https://yoururl.com', '_blank');
});

3

Trong trường hợp bạn đang xử lý <a>thẻ và bạn muốn gián đoạn việc chuyển sang chế độ mặc định, hrefbạn nên sử dụngthis thay thế.

Đi tới url mặc định (yahoo):

<a href="https://yahoo.com" onclick="location.href='https://google.com';"> 

Đi tới url mới (google) onclick:

<a href="https://yahoo.com" onclick="this.href='https://google.com';">

Bằng cách sử dụng, thisbạn đang làm gián đoạn onclicksự kiện trình duyệt hiện tại và thay đổi hreftrước khi tiếp tục hành vi mặc định của<a href='...


Xin chào @Darvydas, mã trên đang hoạt động như mong đợi nhưng làm thế nào để đợi cho đến khi tải trang để thực hiện một sự kiện khác trên url mới được tải.?
FayazMd

@FayazMd không chắc bạn đang cố gắng làm gì? Thông thường, nếu đó là JavaScript bên trong DOM (hiện tại bên trong phần tử của DOM a) như một trang web, bạn không thể kiểm soát hành vi JS trên trang tiếp theo (nơi bạn đang chuyển hướng trang trình duyệt). Khi người dùng rời khỏi trang, nó đã hoàn tất. Trừ khi bạn cũng kiểm soát trang thứ hai và có thể lắng nghe tải trang ở đó cho từng người dùng và kiểm tra xem document.referrerđó có phải là người phù hợp hay không. Ngoài ra, nó có thể là một câu chuyện khác nếu bạn đang sử dụng thứ gì đó như tiện ích mở rộng / tiện ích bổ sung cho trình duyệt có thể lắng nghe các thay đổi URL trang.
Darvydas Šilkus

Xin chào @Darvydas, cảm ơn bạn đã trả lời. Tôi muốn thử như sau. trong bảng điều khiển của trình duyệt, việc sử dụng javascript với chức năng tự thực thi có thể là 1) Tôi muốn tải một trong các url trang web của mình và 2) muốn đợi cho đến khi nó tải hoàn toàn 3) để trang web đó có một bảng mà tôi cần trích xuất tất cả các hàng. Tôi có thể thực hiện bước 1 và nếu tôi đang ở trên trang web đã được tải thì trong bảng điều khiển, tôi có thể trích xuất các hàng trong bảng (bằng mã javascript). Tuy nhiên, khi tôi đang cố gắng viết mã tuần tự cho các bước trên, không thành công ở bước 2.
FayazMd

2

Không hoàn toàn chắc chắn tôi hiểu câu hỏi, nhưng bạn có nghĩa là một cái gì đó như thế này?

$('#something').click(function() { 
    document.location = 'http://somewhere.com/';
} );

vâng, về cơ bản javascript được thiết lập để làm nổi bật các trường của bảng khi người dùng cuộn / di chuột qua nội dung / thông tin của bảng. tôi muốn làm cho nó có vẻ như trường được đánh dấu có thể nhấp được để chúng được liên kết với một trang. nếu điều đó có ý nghĩa hơn. xin lỗi nếu nó không.
John Taylor

đã giải quyết nó. chỉ cần điều chỉnh mã ur một chút thay vì sử dụng # tôi đặt trong tr để đại diện cho bảng và nó đã hoạt động. cảm ơn
John Taylor

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.