Ves93 Ответов: 3

Как открыть ссылку по клику с помощью jquery

Поэтому я использую очень странную CMS, которая мешает мне прикрепить ссылку к url-адресу.

Я не могу сказать вам название CMS, по неизвестным причинам, но это выходит за рамки вопроса.

У меня есть фоновое изображение на теле, и я хотел бы сделать фоновое изображение кликабельной ссылкой, которая вела бы на другую страницу.

Мне нужно сделать это только с помощью jQuery.

Что я уже пробовал:


$('body').click(функция()
{
window.open('ссылка');
});

3 Ответов

Рейтинг:
2

Harsh.Shah.ifour

Привет Вес93

да, это можно сделать легко.

Сначала установите фоновое изображение на тег body. после этого вам нужно добавить простой код jquery в тег <script> :

<html>
<head>
<style>
        body {
            background-image: url('img.jpg');
        }
 </style>
</head>
<body>
<h1>This is Body</h1>
</body>
</html>

<script>
$(document).ready(function () {
        $("*").click(function () {
            window.open('https://www.google.com/');
        });
    });   
</script>

таким образом, как вы можете видеть, что "*" будет выбирать все содержимое всей веб-страницы, поэтому, когда вы нажмете В любом месте всей страницы, вы перенаправитесь на другую страницу. Замените приведенную выше ссылку, добавив свою ссылку.

Надеюсь, это вам поможет.
Спасибо.

Ves93

Ах, проблема в том, что фоновое изображение видно только по бокам - слева и справа, - и я бы не хотел, чтобы люди перенаправлялись на эту конкретную ссылку, когда они нажимают на что-то, что не является фоновым изображением.

[no name]

не могли бы вы показать свой код и свою страницу, пожалуйста, чтобы найти решение ??

Рейтинг:
1

MadMyche

То, что вам нужно сделать, - это выяснить, как идентифицировать этот конкретный элемент; и способ сделать это-через селектор jQuery.
Ваш текущий код выбирает весь текст страницы

Если этот образ имеет ID атрибут на нем, или вы могли бы добавить один; это было бы лучшим способом, и селектор был бы $("#ImageID") Причина, по которой я считаю, что это было бы лучшим способом, заключается в том, что в совместимом HTML ИДЕНТИФИКАТОР может появиться только один раз.

Если использование атрибута ID не является опцией, вы можете основать свой селектор на фактическом атрибуте источника изображения.
<img src="smiley.jpg" /> будет использовать $("[src='smiley.jpg']")

Ссылка:
селекторы jQuery[^]

Ves93

Проблема в том, что изображение добавляется к фону таким образом:


тело {
фоновое изображение: url("отредактированный img url");
}


Так как же я буду целиться в него в этом случае???

Рейтинг:
1

Richard Deeming

Цитата:
проблема в том, что фоновое изображение видно только по бокам - слева и справа, - и я бы не хотел, чтобы люди перенаправлялись на эту конкретную ссылку, когда они нажимают на что-то, что не является фоновым изображением.

По сути, вам нужно перехватить события щелчка на чем-либо внутри тела и остановить их распространение на само тело. Использование jQuery:
$("body").click(function(){ 
    window.open(...); 
});
$("body > *").click(function(e){ 
    e.stopPropagation(); 
});
Демонстрация[^]

NB: Вам нужно будет убедиться, что тело всегда заполняет высоту окна, даже если содержимое страницы короткое: 
body {
    min-height: 100vh;
}

Также обратите внимание, что поля между элементами могут создавать пробелы, которые будут кликабельны. Если вы хотите избежать этого, вам нужно будет обернуть свой некликабельный контент в другой элемент.

Ves93

Ух ты, это же настоящее знание!

Это начинает выглядеть как невыполнимая задача

Почему? Я использую эту очень глупую CMS, и это вызывает массу непредвиденных осложнений, вытекающих из того факта, что элементы, созданные с помощью CMS, поставляются с автоматически генерируемыми классами; и правила для этих классов мне не видны, по крайней мере по большей части, потому что они находятся, так сказать, "за кулисами".