在 displayTag 中禁用超链接

Question

我正在使用 displayTag 表装饰器来显示我的 JSP 页面。

该页面有一个包含列的表格。其中一列是显示 2 个超链接的操作。 一个是付费的，另一个是接近的。每行将有 5 列操作，是带有超链接的最后一列。

这是JSP中的动作显示代码

<display-el:column property="action" sortable="false" title=" "
                            class="defaultTextCentered" style="width:6%" sortName="action" />

下面是我的装饰器代码

public String getAction() {
renderPayLink();
}

private void renderPayLink() {

            decoratedVal.append("<a href=\"javascript:newPopup('");
            decoratedVal.append(getContextPath());
            decoratedVal.append("/abc/taxPaymentInternal.html?iSeqNo=");
            decoratedVal.append(abc.getISeqNumber());
            decoratedVal.append("&iPeriod=");
            decoratedVal.append(abc.getIDate());
            decoratedVal.append("', 800, 700)\" title=\"Pay\">Pay</a>");
            decoratedVal.append("&nbsp;&nbsp;");

    }

因此，单击链接时将打开一个弹出窗口，让用户输入几个详细信息并提交。虽然此弹出窗口打开，但我仍然可以转到主浏览器并再次单击付款，这会刷新弹出窗口并让我再次重新提交信息。一旦我在浏览器中单击然后打开弹出窗口，我必须通过禁用支付按钮来阻止这种情况发生。我怎样才能做到这一点？

用

代替工资

  decoratedVal.append("', 800, 700)\" title=\"Pay\" ");
            decoratedVal.append("onclick=\"this.setAttribute(");
            decoratedVal.append("\'style\', \'pointer-events:none; cursor:default;\'); this.setAttribute("); 
            decoratedVal.append("\'href\', \'\')\">Pay</a>");
            decoratedVal.append("&nbsp;&nbsp;");

从 f12 调试中获取“无法获取未定义或空引用的属性 'setAttribute'”错误。

   <a title="Pay" onclick="this.setAttribute('style', 'pointer-events:none; cursor:default;'); this.setAttribute('href', '')" href="javascript:newPopup('/mei/invoicing/launchConfirmPaymentInternal.html?invoiceSeqNo=131946&amp;invoicePeriod=02-11-2017', 800, 700)">Pay</a>

Answer 1

一种方法是在单击 <a> 标记时禁用它。

简单的解决方案：

你可以替换这一行：

decoratedVal.append("', 800, 700)\" title=\"Pay\">Pay</a>");

与那些：

decoratedVal.append("', 800, 700)\" title=\"Pay\")
decoratedVal.append("onclick=\"this.setAttribute(")
decoratedVal.append("\'style\', \'pointer-events:none; cursor:default;\'); this.setAttribute(");
decoratedVal.append("\'href\', \'\')\">Pay</a>");

请注意，该链接将在页面刷新时再次可用。如果您需要其他方式来激活它，则需要手动进行。

更优雅的解决方案：

如果你有一个样式表，比如一个 CSS 文件，你可以在那里创建这个类：

.disabledLink{
    pointer-events: none;
    cursor: default;
}

在链接标签的onclick 事件中，将setAttribute 替换为addClass('disabledLink')。这也使它更容易删除，removeClass('disabledLink')