Как создавать гиперссылки в jquery

#jquery #hyperlink

#jquery #гиперссылка

Вопрос:

Ниже приведен код, который создает черный текст на прикрепленном изображении..

Это рисунок, выполненный в jquery. Мне нужно сделать эти круги гиперссылками (на изображении). Всякий раз, когда эти круги будут нажаты, откроется другая вкладка. есть идеи, как это сделать?

 function oncanvasmousemove(evt) {
    clearTimeout(timer);
    lastTimeMouseMoved = new Date().getTime();
    timer = setTimeout(function () {
        var currentTime = new Date().getTime();
        if (currentTime - lastTimeMouseMoved > 300) {
            var mousePos = getMousePos(canvas, evt);
            var tC, isMatched = false;
            for (c = 0; c < circles.length; c  ) {
                tC = circles[c];
                if (mousePos.DistanceTo(tC.centerX, tC.centerY) < tC.Radius   5) {
                    isMatched = true;
                    break;
                }
            }
            if (isMatched === true) {
                $("#tooltip").html(tC.Text).css({
                    'top': mousePos.Y   canvasoffset.top - 40,
                        'left': mousePos.X   canvasoffset.left - $("#tooltip").width() / 2
                }).show();
            } else {
                $("#tooltip").click(function () {
                    alert("The paragraph was clicked.");
                });
            }
        }
    }, 300);
}
  

Комментарии:

1. Прикрепленного изображения нет.

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

3. Вы можете попробовать сохранить гиперссылки в своем массиве circles. Затем в вашем цикле сопоставления вы можете получить гиперссылку для выбранного круга и открыть ссылку в новом окне через window.open('url', 'window name', '_blank');

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

Ответ №1:

Мы можем использовать теги map и area, чтобы связать множество гиперссылок с изображением для получения определенных координат.

Используя эти теги, мы можем прикреплять больше гиперссылок к одному изображению на основе координат.

Вот пример кода:

 <!DOCTYPE html>
<html>
<body>

<p>Click on the sun or on one of the planets to watch it closer:</p>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

</body>
</html> 
  

Источник

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

Комментарии:

1. спасибо за этот ответ.. но я не использовал изображение .. это рисунок, который я сделал с помощью jquery, который похож на блок-схемы.. как использовать этот атрибут usemap там?