javascript - 在 javascript 中第一次单击后禁用表格单元格

Question

我有一个表格单元格如下:

<td id=report onMouseUp='clickReport()' onKeyPress='clickReport()' >Click</td>";

事件函数如下:

function clickReport() {
document.form.submit();
}

提交表单时，有一个后端进程正在进行。在第一个进程完成之前(即，直到页面重新加载)，我不希望用户再次按下“单击”，否则可能会影响之前正在运行的进程。 因此，我想到在第一次按下后禁用“点击”。

我尝试使用 PreventDefault() 但它不起作用。

function clickReport() {
document.form.submit();
document.getElementById("report").onMouseUp = function(e) 
{
 e.preventDefault();
 return false;
}
document.getElementById("report").onKeyPress = function(e) 
{
 e.preventDefault();
 return false;
}
}

有人可以帮忙吗？

Answer 1

1) 您可以将 element 参数传递给事件函数，这样您就可以轻松访问 DOM 元素。见下文。

<td id=report onMouseUp='clickReport(this)' onKeyPress='clickReport(this)' >Click</td>";

2) 在第一个函数运行时，您可能会将事件清空，这样它们就不会再触发。见下文。

// the *element* parameter is yor <td> element here 
function clickReport(element) {
    document.form.submit();
    element.onMouseUp = null;
    element.onKeyPress= null;
}

3) 如果您只想让它在点击时起作用，您可以使用onclick事件而不是onmouseup并摆脱onkeypress .

<td id=report onclick='clickReport(this)'>Click</td>";

function clickReport(element) {
    document.form.submit();
    element.onclick= null;
}

<小时/>

工作代码笔:https://codepen.io/anon/pen/MmVNMe