Добавление функции onclick для перехода по URL-адресу в JavaScript?


100

Я использую этот красивый маленький JavaScript, чтобы выделить поле, когда пользователь наводит на него курсор. Не могли бы вы сказать мне, есть ли способ добавить onclickфункцию, которая будет действовать как ссылка и переходить по 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>

Как мне получить значение URL-адреса, это ссылка в одной из ячеек таблицы или все они ведут на один и тот же URL-адрес
— Ренон Стюарт,

2
У вас там довольно странный id "# read_message.php"?
— Alex Gill

Ответы:


169

Пытаться

 window.location = url;

Также используйте

 window.open(url);

если хотите открыть в новом окне.


131

Просто используйте это

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

9
При этом ссылка откроется в том же окне, а принятый ответ откроется в новом окне. Я предпочитаю такой подход к ответу
— Хамман Сэмюэл

33

В jquery для отправки пользователя по другому URL-адресу вы можете сделать это так:

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

этот способ тоже будет работать, но приведенный выше - более новый, более правильный способ сделать это в наши дни

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

Если вы хотите открыть ссылку в новой вкладке, вы можете:

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

3

Если вы имеете дело с <a>тегом и хотите прервать переход к значениям по умолчанию, hrefвы должны использовать thisвместо этого.

Перейти к URL-адресу по умолчанию (yahoo):

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

Перейдите на новый URL (Google) onclick:

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

Используя, thisвы прерываете текущее onclickсобытие браузера и меняете его hrefперед продолжением поведения по умолчанию<a href='...


Привет, @Darvydas, приведенный выше код работает должным образом, но как дождаться загрузки страницы, чтобы выполнить другое событие на вновь загруженном URL-адресе?
— FayazMd

@FayazMd не уверен, что вы пытаетесь сделать? Обычно, если это JavaScript внутри DOM (в настоящее время внутри элемента DOM a) в качестве веб-страницы, вы не можете управлять поведением JS на следующей странице (где вы перенаправляете страницу браузера). Когда пользователь покидает страницу, все готово. Если только вы не контролируете и вторую страницу, и можете прослушивать загрузку страницы для каждого пользователя и проверять, document.referrerправильный ли это человек. Кроме того, это может быть другая история, если вы используете что-то вроде расширения / надстройки для браузера, которое может прослушивать изменения URL-адресов страниц.
— Дарвидас Шилкус

Привет, @Darvydas, спасибо за ответ. Я хочу попробовать следующее. в консоли браузера использование javascript с функцией самовыполнения может быть: 1) я хочу загрузить URL-адрес одного из моих веб-сайтов и 2) хочу подождать, пока он полностью загрузится 3) чтобы на этой веб-странице была таблица, из которой мне нужно извлеките все строки. Я могу выполнить шаг 1, и если я нахожусь на уже загруженном веб-сайте, то в консоли я могу извлекать строки таблицы (в коде javascript). Но когда я пытаюсь писать код последовательно для вышеуказанных шагов, на шаге 2 не
— получается.

2

Не совсем уверен, что понимаю вопрос, но вы имеете в виду что-то вроде этого?

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

да, в основном javascript настроен для выделения полей таблицы, когда пользователь прокручивает / наводит курсор на содержимое / информацию таблицы. Я хотел бы сделать так, чтобы выделенное поле было интерактивным, поэтому они связаны со страницей. если это имеет смысл. извините, если это не так.
— Джон Тейлор

решил это. просто немного адаптировал код ur вместо использования # я ввел tr для представления таблицы, и это сработало. спасибо
— Джон Тейлор

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.