如何使用Javascript将单击事件保存到HTML表单

我有一个HTML表单，其中包含以下格式的几个链接：

<a id="url_1" href="#" target="_blank">LINK</a>

并将

onclick=“updateInput（this.value）”

添加到链接中，但这不起作用

我想问题在于链接不是输入，因此无法更新。但是，我一直在为表单创建适当的输入。在提交表单后产生的数据文件中，一个变量应指示链接是否已被单击。

函数updateInput（）{
document.getElementById（“url_1”）.innerHTML=“单击”；
}

---

您可以使用隐藏输入保存单击链接的数组

var clickedlinks=[]；
document.querySelectorAll（“a”）.forEach（（a）=>{
a、 addEventListener（“单击”，addtoarr）；
});
文件。查询选择器（“表格”）。增补的列表器（“提交”，FNSmit）；
函数addtoarr（）{
单击links.push（this.outerHTML）；
}
函数fnsubmit（）{
this.querySelector（“input[type=hidden]”。value=JSON.stringify（clickedlinks）；
log（JSON.parse（this.querySelector（“input[type=hidden]”）的.value）[0]）；
event.preventDefault（）；//返回true；
}

试试看

varids=[“url_1”]；
for（让id中的id）{
document.querySelector（`a#${id}`）.addEventListener（“单击”，函数（事件）{
event.preventDefault（）；
event.stopPropagation（）；
console.log（“阻止在锚上单击导航”）；
// ...
//做你的事
// ...
var link=document.querySelector（`a#${id}`）.getAttribute（“href”）；
如果（链接[0]=“#”）{
link=`${location.href.split（“#”）[0]}${link}`；
}
location.href=链接；
});
}

---

今天在一位同事的帮助下解决了这个问题。这是唯一对我有效的解决方案：

JavaScript:

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>

<script>
var clickedlinks = [0,0,0,0];

$('html').on('click','.tracked',function () {
    var id = $(this).attr('id').split('_')[1];
    console.log(id);
    clickedlinks[id] += 1;
    $('#tracker').val(clickedlinks);
});
</script>

var clickedlinks=[0,0,0,0]；
$（'html'）。在（'click'，'tracked'，函数（）上{
var id=$（this.attr（'id'）.split（'uuz'）[1]；
console.log（id）；
点击链接[id]+=1；
$（'#tracker'）.val（单击链接）；
});

HTML:

链接
链接
链接
链接

---

单击每个链接的次数保存在

clickedlinks

中，然后通过隐藏的输入字段作为

tracker

发送到表单。为了实现这一点，每个链接id必须以

{number}

结尾，如

url\u 1

中所示。您是否可以发布整个表单，并澄清单击链接时要更新的具体内容？这将不起作用，提交表单时a标签的信息不可用。

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>

<script>
var clickedlinks = [0,0,0,0];

$('html').on('click','.tracked',function () {
    var id = $(this).attr('id').split('_')[1];
    console.log(id);
    clickedlinks[id] += 1;
    $('#tracker').val(clickedlinks);
});
</script>

<form>
<a id="url_0" class="tracked" target="_blank">LINK</a>
<a id="url_1" class="tracked" target="_blank">LINK</a>
<a id="url_2" class="tracked" target="_blank">LINK</a>
<a id="url_3" class="tracked" target="_blank">LINK</a>
<input id="tracker" type="hidden" name="tracker">
<input type="submit">
</form>