¿Agregar una función onclick para ir a la URL en JavaScript?


100

Estoy usando este pequeño y elegante JavaScript para resaltar un campo cuando el usuario se desplaza sobre él. ¿Podría decirme si hay alguna forma de agregar una onclickfunción que actúe como un enlace y vaya a una 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>

¿Cómo obtengo el valor de la URL? ¿Es un enlace en una de las celdas de la tabla o todas van a la misma URL
Renon Stewart

2
¿Tiene una identificación bastante extraña allí '# read_message.php'?
Alex Gill

Respuestas:


168

Tratar

 window.location = url;

También use

 window.open(url);

si desea abrir en una nueva ventana.


129

Simplemente usa esto

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

9
Esto abre el enlace dentro de la misma ventana, mientras que la respuesta aceptada se abre en una nueva ventana. Prefiero el enfoque de esta respuesta
Hamman Samuel

33

En jquery para enviar un usuario a una URL diferente, puede hacerlo así:

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

de esta manera también funcionará, pero lo anterior es la forma más nueva y correcta de hacerlo en estos días

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

Si desea abrir el enlace en una nueva pestaña, puede:

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

3

En caso de que esté lidiando con una <a>etiqueta y desee interrumpir el paso al valor predeterminado href, debe usar thisen su lugar.

Ir a la URL predeterminada (yahoo):

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

Ir a la nueva URL (google) onclick:

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

Al usar this, está interrumpiendo el onclickevento actual del navegador y cambiando hrefantes de continuar con el comportamiento predeterminado de<a href='...


Hola @Darvydas, el código anterior funciona como se esperaba, pero ¿cómo esperar hasta que se cargue la página para realizar otro evento en la URL recién cargada?
FayazMd

@FayazMd ¿no está seguro de lo que está tratando de hacer? Por lo general, si es JavaScript dentro del DOM (actualmente dentro del elemento DOM a) como una página web, no puede controlar el comportamiento de JS en la página siguiente (donde está redirigiendo la página del navegador). Cuando el usuario abandona la página, está hecho. A menos que también controle la segunda página, y pueda escuchar la carga de la página allí para cada usuario y verificar document.referrersi es la persona adecuada. Además, podría ser otra historia si está usando algo como una extensión / complemento para el navegador que puede escuchar los cambios de URL de la página.
Darvydas Šilkus

Hola @Darvydas, gracias por tu respuesta. Quiero probar lo siguiente. en la consola del navegador, usar javascript con función autoejecutable puede ser 1) Quiero cargar la URL de uno de mis sitios web y 2) quiero esperar hasta que se cargue por completo 3) para que esa página web tenga una tabla desde la cual necesito extraer todas las filas. Puedo realizar el paso 1 y si estoy en el sitio web ya cargado, en la consola puedo extraer filas de la tabla (en código javascript). Pero, cuando intento escribir código secuencialmente para los pasos anteriores, fallo en el paso 2.
FayazMd

2

No estoy completamente seguro de entender la pregunta, pero ¿te refieres a algo como esto?

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

sí, básicamente el javascript está configurado para resaltar los campos de la tabla cuando un usuario se desplaza / se desplaza sobre el contenido / información de la tabla. Me gustaría que parezca que se puede hacer clic en el campo resaltado para que estén vinculados a una página. si eso tiene más sentido. lo siento si no es así.
John Taylor

resuelto. simplemente adapté tu código ligeramente en lugar de usar # puse tr para representar la tabla y funcionó. gracias
John Taylor

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.