LinkBut​​ton，如何通过“ asp：LinkBut​​ton”防止双重错误？或在首次单击后禁用“ asp：LinkBut​​ton”

Question

我试图避免双击，即第一次单击可以通过javascript函数禁用“ asp: LinkButton”，所有这些都在“ aspx”页面中。

我在前端的经验很少，如果您能支持我，我会谢谢您。

我只是尝试使用：setAttribute, getElementById, attr。

我只是尝试使用：setAttribute, getElementById, attr。

<div class="modal-footer">
  <div class="btn-group" role="group">
    <asp:LinkButton ID="btnBringDataFlow" runat="server" CssClass="btn btn-danger" ToolTip="Cancel"
                    OnClick="btnBringDataFlow_Click" OnClientClick="preventDoubleClick()">Bring Data
    </asp:LinkButton>
    <asp:LinkButton ID="btnCancel" runat="server" CssClass="btn btn-primary" ToolTip="Cancel">Cancel</asp:LinkButton>
  </div>
</div>


<script type="text/javascript">
  function disabledLinkBringDataFlow() {

    document.getElementById('btnBringDataFlow').setAttribute("disabled", "");

    //document.getElementById("btnBringDataFlow").disabled = true;
  }
</script>  

我希望在第一次单击后禁用“ asp: LinkButton”，以避免重复执行该功能

Answer 1

我认为，为了使您的Javascript方法通过ID获得元素，您需要将ClientIDMode = "Static"属性添加到LinkBut​​ton控件中。默认情况下，服务器控件将在控件的ID值中添加一些文本。

<asp:LinkButton ClientIDMode="Static" ID="btnBringDataFlow" runat="server" CssClass="btn btn-danger" ToolTip="Cancel" OnClick="btnBringDataFlow_Click" OnClientClick="preventDoubleClick()">Bring Data</asp:LinkButton>

如果您想了解有关ClientIDMode属性的更多信息，请参见：ClientIDMode

Answer 2

asp:LinkButton呈现锚标记。使用this关键字访问定位符及其属性：

<asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="Id" />
        <asp:TemplateField>
            <ItemTemplate>
                <asp:LinkButton ID="btnBringDataFlow" runat="server" CssClass="btn btn-danger" ToolTip="Cancel"
                    OnClientClick="preventDoubleClick(this)">Bring Data
                </asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<script>
    function preventDoubleClick(sender) {
        sender.setAttribute("disabled", "");
    }
</script>

如果您喜欢使用内联代码onClienClick="this.setAttribute('disabled', '');"

Answer 3

谢谢大家

我的解决方法如下：

  <script>
        function preventDoubleClick() {
             $("#" + '<%= btnBringDataFlow.ClientID %>').addClass("disabled");
                $("#" + '<%= btnBringDataFlow.ClientID %>').attr("disabled", "disabled");
        }
    </script> 

<asp:LinkButton ID="btnBringDataFlow" runat="server" CssClass="btn btn-danger" ToolTip="Cancel" OnClick="btnBringDataFlow_Click" OnClientClick="preventDoubleClick()" >Bring Data</asp:LinkButton>