Adicionando uma função onclick para ir para url em JavaScript?


100

Estou usando este pequeno JavaScript sofisticado para destacar um campo enquanto o usuário passa o mouse sobre ele. Você poderia me dizer se há uma maneira de adicionar uma onclickfunção que funcione como um link e vá para um 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>

Como obtenho o valor do url, é um link em uma das células da tabela ou todos vão para o mesmo url
Renon Stewart

2
Você tem um id bastante estranho lá '# read_message.php'?
Alex Gill

Respostas:


168

Experimentar

 window.location = url;

Também use

 window.open(url);

se você deseja abrir em uma nova janela.


129

Basta usar isso

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

9
Isso abre o link na mesma janela, enquanto a resposta aceita é aberta em uma nova janela. Eu prefiro a abordagem desta resposta
Hamman Samuel

33

No jquery, para enviar um usuário a uma URL diferente, você pode fazer assim:

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

essa forma também funcionará, mas a acima é a maneira mais nova e correta de fazer isso hoje em dia

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

11
function URL() {
    location.href = 'http://your.url.here';
}

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

Se desejar abrir o link em uma nova guia, você pode:

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

3

No caso de você estar lidando com <a>tag e quiser interromper a passagem para o padrão, hrefvocê deve usar this.

Vá para o url padrão (yahoo):

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

Vá para o novo url (google) onclick:

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

Ao usar, thisvocê interrompe o onclickevento atual do navegador e muda hrefantes de continuar com o comportamento padrão de<a href='...


Olá @Darvydas, o código acima está funcionando conforme o esperado, mas como esperar até que a página carregue para realizar outro evento na url recém-carregada.?
FayazMd

@FayazMd não tem certeza do que está tentando fazer? Normalmente, se for JavaScript dentro do DOM (atualmente dentro do elemento DOM a) como uma página da web, você não pode controlar o comportamento do JS na próxima página (onde você está redirecionando a página do navegador). Quando o usuário sai da página, está feito. A menos que você controle a segunda página também e possa ouvir o carregamento da página para cada usuário e verificar document.referrerse é a pessoa certa. Além disso, pode ser outra história se você estiver usando algo como uma extensão / add-on para o navegador que pode ouvir as alterações do URL da página.
Darvydas Šilkus

Olá @Darvydas, obrigado pela resposta. Eu quero tentar o seguinte. no console do navegador, usar javascript com função de autoexecução pode ser 1) Quero carregar a url de um dos meus sites e 2) quero esperar até que carregue completamente 3) para que essa página da web tenha uma tabela da qual preciso extraia todas as linhas. Consigo executar a etapa 1 e, se estiver no site já carregado, no console, posso extrair as linhas da tabela (em código javascript). Mas, quando estou tentando escrever código sequencialmente para as etapas acima, falho na etapa 2.
FayazMd

2

Não tenho certeza se entendi a pergunta, mas você quer dizer algo assim?

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

sim, basicamente o javascript é configurado para destacar os campos da tabela conforme o usuário rola / passa o mouse sobre o conteúdo / informações da tabela. gostaria de fazer parecer que o campo realçado é clicável, de modo que eles estão vinculados a uma página. se isso faz mais sentido. desculpe se isso não acontecer.
John Taylor,

Resolvi-o. apenas adaptei seu código ligeiramente em vez de usar # eu coloquei em tr para representar a tabela e funcionou. obrigado
John Taylor

0

experimentar

location = url;

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.