如何将值从锚标记传递到 javascript 变量内的 html 代码

Question

我有一个打开弹出窗口的锚标记，弹出窗口本身有一个锚标记，后者是用 javascript 生成的。我需要将一个值从第一个锚标记传递到第二个。

弹出代码：

<a class="btn-opt btn-sm image-options" data-bs-container="body"
    data-bs-toggle="popover" data-bs-placement="left"
    data-bs-html="true"><i class="fa-solid fa-ellipsis"></i></a>

Java脚本：

var popString2 = "";
popString2 = popString2 + "<a href='#' class='options' id ='saveImage'>Save image<span class='icon-pop'><i class='fa-regular fa-floppy-disk'></i></span></a>";

  $(".image-options").attr('data-bs-content', popString2);

我将 popString2 分配给类为 image-options 的所有锚标记的 data-bs-content 属性，因为我有几个。 javascript 中的“保存图像”链接将触发图像下载。

单击弹出窗口时，我需要它将图像 URL 作为 href 值传递给 popString1 变量中的定位标记。

我正在用 Flask 加载图像。我还可以为每个图像加载一个 id 属性值，然后将该值以某种方式添加到弹出代码中，这样我就可以将它传递给 javascript。但我真的不知道最后一部分是否可行。

This screenshot will maybe help understand what I need to achieve.

Answer 1

好的，我有一个想法，但我不知道 javascript，所以我确定我的代码是错误的，主要是因为它不起作用。

这个想法是将动态生成的 id 属性分配给 img 和 popover 锚标记。锚标记的 id 属性是数据库中的图像 ID，我用 Flask 加载它，这样它是唯一的。 img 标签 id 属性与锚标签相同，但在末尾添加了“img”。前任。 <a id="1"></a> / <img id="1img">。然后使用 onclick 事件从锚标记调用 javascript 函数。

我对 javascript 函数的尝试是这样的：

    function url_getter() {
      var icon_id = $("this").attr('id');
      var img_id = "#" + icon_id + "img";
      var the_url = $(img_id).attr('href');
         return the_url;
     };

      var img_url = url_getter();

      var popString2 = "";
      popString2 = popString2 + "<a href='" + img_url + "' class='options'>Save image <span class='icon-pop'><i class='fa-regular fa-floppy-disk'></i></span></a>";

       $(".image-options").attr('data-bs-content', popString2);

HTML 代码：

<img class="card-img-top card-img-bottom thumb" data-bs-toggle="modal"
data-bs-target="#myModal" src="{{ url_for('static',filename=image[1]) }}" id="{{ image[0] ~ 'img' }}">

<a class="btn-opt btn-sm image-options" data-bs-container="body" data-bs-toggle="popover" data-bs-placement="left" data-bs-html="true" id="{{ image[0] }}" onclick="url_getter()"><i class="fa-solid fa-ellipsis"></i></a>

这行得通吗？如果是这样，我的代码有什么问题？