单击后如何禁用搜索按钮答案

【问题标题】：How to Disable the search button once it is clicked单击后如何禁用搜索按钮
【发布时间】：2017-09-05 00:00:58
【问题描述】：

点击后我需要禁用搜索按钮。这需要附加在以下代码中。

<form class="search-head" id="frmSearch" action="<%= resultString %>" method="get">
    <input name="q" class="<%=cssName%> search-tags" id="tags" value="q" maxlength=50 />

    <input type="hidden" name="_charset_" value="utf-8" />
    <input type="hidden" id="searchLabel" name="searchLabel" value='<%=currentStyle.get("searchLabel", "")%>' />
        <c:if test="${enableSpringerSearch eq true}">
            <button type="button" class="change-search-engine">${springerButtonLabel}</button>
        </c:if>
    <button type="submit"><fmt:message key="label_button"/></button>

任何帮助将不胜感激！

【问题讨论】：

你检查了自己什么？查看 onclick 事件。

标签： javascript forms button

【解决方案1】：

你可以创建一个单独的函数来处理它：

document.getElementById("idOfButton").onclick = function() {
    //disable
    this.disabled = true;
}

【讨论】：

谢谢。但是我怎样才能将它嵌入到上面的代码中。我可以在之后添加吗
为您的按钮分配一个 id，例如 <button id = myButton type=submit>，而不是 JS 代码中的 "idOfButton" 放入 "myButton"。每当单击按钮时，它将被禁用。

【解决方案2】：

function disableBtn() {
    document.getElementById("btn").disabled = true;
}

<input type="hidden" name="_charset_" value="utf-8" />
<input type="hidden" id="searchLabel" name="searchLabel" value='<%=currentStyle.get("searchLabel", "")%>' />
    <c:if test="${enableSpringerSearch eq true}">
        <button id="btn" type="button" onclick="disableBtn()"  class="change-search-engine">search</button>
    </c:if>
<button type="submit"  ><fmt:message key="label_button"/></button>

【讨论】：

它不起作用，代码显示在搜索图标附近。 function disableBtn() { document.getElementById("btn").disabled = true; }