Добавление функции 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.