javascript - 在 jquery 中传递超链接数组

Question

我正在使用 jquery 和 html 创建一个流程图，其中包含节点(圆圈)和连接这些圆圈的箭头。需要完成两个操作，一个是工具提示操作，当您将光标悬停时，它将显示特定的文本在特定的圈子上。另一个功能是，每当我们单击这些圆圈时，都会弹出另一个 html 页面，也就是超链接。我有 18 个圈子，我已经创建了所需的 18 个 HTML 页面。但是我停留在超链接上。我不知道如何将这些超链接传递到我的 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").hide();
            }
        }
    }, 300);
}

我附上页面的图片

Answer 1

您需要为每个圈子指定一个 CSS ID。

在我的示例中，我将只使用“#circle-1”、“#circle-2”...“#circle-18”。

同时为每个圆圈添加一个 CSS 类。对于我的示例，我将使用“.circle-link”。

//On clicking anything with the circle-link class...
$('.circle-link').click(function() {

    var link_id = $(this).attr("id"); //Get ID of circle that was clicked

    //Get ID number
    link_id = link_id.split("-"); //Split the string on the dash/hyphen (returns array)
    link_id = link_id[2]; //Get second array element (should be the number)

    //Use the above number to determine which link to call

});