Question

我尝试在点击后禁用超链接。我找到了使用onSubmit函数的解决方案，因为这将允许表单提交，然后立即禁用链接，但在这里它没有这样做。

我还编写了一个JavaScript函数，但问题是如何在单击按钮后调用此函数。

JS

 function disableLink() {
     if(document.getElementById('downloadReport').clicked = true) {
        document.getElementById('downloadReport').disabled = true;   
     }
 }

形式：

 <td class="dataFieldCell">
            <div class="esignNavigation">
                <s:if test="%{#parameters.showReport}">
                <a href="#x" id="downloadReport" style="width:155px" title="This function will provide you a 30 day download of all your eSign transactions." onSubmit="document.getElementById('viewIntegrationReport').disabled=true"><span>Export E-Sign Information</span></a> 
                </s:if>             
            </div> 
        </td>

如果有人做过类似的事，请告诉我。

感谢。

Answer 1

锚元素a不是表单元素，因此它不会触发onsubmit事件。您需要绑定到“click”事件并自己处理单击状态。所有浏览器都不支持锚元素的“禁用”属性，因此您不能依赖它来进行行为或更改外观。您需要向该类的元素和CSS添加一个类，以使其显示为禁用。

var elem = document.getElementById("download");
elem.addEventListener("click", myFunction, false);

var download_clicked = false;
function myFunction(ev) {
  if(download_clicked) {
    ev.stopPropagation();
  } else {
    alert("One time!");
    download_clicked = true;
    elem.classList.add("disabled");
  }
}

a.disabled {
  color: #aaa;
  text-decoration: none;
  cursor: default;
}

<a href="#" id="download">This Works</a>
<br>
<a href="#" id="download2" onclick='alert("Every Time!\ndisabled="+this.disabled);this.disabled=true;'>This doesn't</a>

Answer 2

您可以在提交后添加css类：

.disabled-link{
    pointer-events: none;
    cursor: default;
}

Can i Use browser support

提交表单后禁用超链接

2 个答案: