Dodanie funkcji onclick, aby przejść do adresu URL w JavaScript?


100

Używam tego fantazyjnego małego JavaScript, aby podświetlić pole, gdy użytkownik najedzie na nie. Czy możesz mi powiedzieć, czy istnieje sposób na dodanie onclickfunkcji, która będzie działać jako łącze i będzie prowadzić do adresu URL?

<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>

Jak uzyskać wartość adresu URL, czy jest to link w jednej z komórek tabeli, czy też wszystkie prowadzą do tego samego adresu URL
Renon Stewart

2
Masz dość dziwny identyfikator '# read_message.php'?
Alex Gill,

Odpowiedzi:


169

Próbować

 window.location = url;

Użyj również

 window.open(url);

jeśli chcesz otworzyć w nowym oknie.


131

Po prostu użyj tego

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

9
Spowoduje to otwarcie łącza w tym samym oknie, a zaakceptowana odpowiedź zostanie otwarta w nowym oknie. Wolę podejście tej odpowiedzi
Hamman Samuel

33

W jquery, aby wysłać użytkownika na inny adres URL, możesz to zrobić w następujący sposób:

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

ten sposób też będzie działał, ale powyższy sposób jest nowszy, bardziej poprawny w dzisiejszych czasach

$("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

Jeśli chcesz otworzyć link w nowej karcie, możesz:

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

3

Jeśli masz do czynienia z <a>tagiem i chcesz przerwać przejście do wartości domyślnej, hrefktórej powinieneś użyć this.

Przejdź do domyślnego adresu URL (yahoo):

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

Przejdź do nowego adresu URL (google) onclick:

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

Używając this, przerywasz bieżące onclickzdarzenie przeglądarki i zmieniasz go hrefprzed kontynuowaniem domyślnego zachowania<a href='...


Cześć @Darvydas, powyższy kod działa zgodnie z oczekiwaniami, ale jak poczekać, aż strona się załaduje, aby wykonać inne zdarzenie na nowo załadowanym adresie URL.?
FayazMd

@FayazMd nie jesteś pewien, co próbujesz zrobić? Zwykle, jeśli jest to JavaScript wewnątrz DOM (obecnie wewnątrz elementu DOM a) jako strona internetowa, nie możesz kontrolować zachowania JS na następnej stronie (gdzie przekierowujesz stronę przeglądarki). Gdy użytkownik opuszcza stronę, koniec. Chyba że kontrolujesz również drugą stronę i możesz nasłuchiwać ładowania strony dla każdego użytkownika i sprawdzać document.referrer, czy to właściwa osoba. Może to być również inna historia, jeśli używasz czegoś takiego jak rozszerzenie / dodatek do przeglądarki, który może nasłuchiwać zmian adresu URL strony.
Darvydas Šilkus

Cześć @Darvydas, dziękuję za odpowiedź. Chcę spróbować, jak następuje. w konsoli przeglądarki, przy użyciu javascript z funkcją samowykonującą się może być 1) chcę załadować adres URL jednej z moich stron internetowych i 2) chcę poczekać, aż się całkowicie załaduje 3) tak, aby ta strona miała tabelę z której muszę wypakuj wszystkie wiersze. Potrafię wykonać krok 1 i jeśli jestem na już załadowanej witrynie, to w konsoli mogę wyodrębnić wiersze tabeli (w kodzie javascript). Ale kiedy próbuję napisać kod sekwencyjnie dla powyższych kroków,
kończy się

2

Nie jestem do końca pewien, czy rozumiem pytanie, ale czy masz na myśli coś takiego?

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

tak, zasadniczo javascript jest ustawiony tak, aby podświetlał pola tabeli, gdy użytkownik przewija / najeżdża na zawartość tabeli / informacje. Chciałbym, aby wyglądało na to, że podświetlone pole jest klikalne, więc są one połączone ze stroną. jeśli to ma więcej sensu. przepraszam, jeśli nie.
John Taylor

rozwiązałem to. po prostu nieznacznie dostosowałem kod zamiast używać # i wstawiłem tr do reprezentowania tabeli i zadziałało. dzięki
John Taylor

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.