Question

我有一个JS函数，可编辑填充输入的值。

我正在通过ID提取输入的值，该ID是函数的参数，并且在单击时调用这些函数。

我的问题是，当我单击以编辑第一个输入时，它可以工作，但是随后我想编辑第三个输入。它会编辑第一个和第三个输入？

如何重设功能以仅编辑第三个？

这是我的JS函数

function editTicket(id) {
let toEdit = id;
document.getElementById("inputRow" + toEdit).style.backgroundColor = "#6C63FF";
document.getElementById("inputRow" + toEdit).style.color = "#fff";
$("#imgtoCenter").click(function (e) {

    var offset = $("#imgtoCenter").offset();
    var relativeX = (e.pageX - offset.left);
    var relativeY = (e.pageY - offset.top);

    sessionStorage.removeItem('x' + toEdit);
    sessionStorage.removeItem('y' + toEdit);
    document.getElementById("inputRow" + toEdit).style.backgroundColor = "#fff";
    document.getElementById("inputRow" + toEdit).style.color = "#000";
    sessionStorage.setItem('x' + toEdit, Math.round(relativeX));
    sessionStorage.setItem('y' + toEdit, Math.round(relativeY));
    document.getElementById("x" + toEdit).value = sessionStorage.getItem('x' + toEdit);
    document.getElementById("y" + toEdit).value = sessionStorage.getItem('y' + toEdit);
});

}

如果我使用console.log（id），则获得了上次单击和新单击的值。

谢谢..！

Answer 1

来自jQuery click documentation

附加说明：由于.click（）方法只是.on（“ click”，handler）的简写，因此可以使用.off（“ click”）分离>。

每次调用editTicket方法时，都会在#imgtoCenter元素上附加一个click事件。所有这些单击事件都在元素上累积，当您单击#imgtoCenter时，将使用其保留的先前ID触发所有处理程序。

只需$("#imgtoCenter").off('click')在editTicket方法的末尾。

带参数的JS函数的多次调用

1 个答案: