點選按鈕變成灰色不可再次點選
原文轉載自http://www.santii.com/article/24.html
很多時候,當我們點選提交按鈕,如果因為執行的程式太慢,或是網路問題,就會一直處於提交狀態。
不瞭解的人,還以為是沒有提交成功,於是就會一直點提交、提交、提交……
這樣就會造成多次提交,而產生重複記錄。
那麼要如何才能防重複提交呢?
小編的做法就是,使用js來控制。
當點選提交後將按鈕變成灰色,並將其value值改為一個提示資訊,比如“正在提交中,請稍等...”
下面我們來看看詳細程式碼。
<style> input.btn_add{ background:#1abc9c; font-size:22px; color:#fff; border-radius:4px; border:none;width:200px; height:50px;} input.btn_add_no{ background:#cccccc; font-size:22px; color:#333; border-radius:4px; border:none;width:200px; height:50px;} </style> <input type="button" name="syncbtn" class="syncbtn btn_add" value="同步訂單" /> <script> $(document).on("click",".syncbtn",function(){ var oldvalue=$(this).val(); $(this).val("正在同步,請稍等......"); $(this).attr("disabled","disabled"); $(this).removeClass("btn_add"); $(this).addClass("btn_add_no"); alert("暫停");//由於這裡沒有執行過程久的程式,所以使用alert才能看到效果。 //執行相關程式碼 //執行成功後再還原回去,如下程式碼 $(this).removeAttr("disabled"); $(this).removeClass("btn_add_no"); $(this).addClass("btn_add"); $(this).val(oldvalue); }); </script>
在例項中,我們有用到unbind()方法,其目的地是移除按鈕的事件處理程式,也就是當按鈕處於灰色狀態時,點選也不會執行程式碼。
相關推薦
點選按鈕變成灰色不可再次點選
原文轉載自http://www.santii.com/article/24.html 很多時候,當我們點選提交按鈕,如果因為執行的程式太慢,或是網路問題,就會一直處於提交狀態。 不瞭解的人,還以為是沒有提交成功,於是就會一直點提交、提交、提交…… 這樣就會造成多次提交,
點擊按鈕變成灰色不可再次點擊
back order one script 執行 提示信息 如何 events 提交按鈕 很多時候,當我們點擊提交按鈕,如果因為執行的程序太慢,或是網絡問題,就會一直處於提交狀態。 不了解的人,還以為是沒有提交成功,於是就會一直點提交、提交、提交…… 這樣就會造成多次提交,
react狀態的使用:實現一個文字框點選按鈕之前是文字框 點選以後變成密碼框 並且按鈕的內容也改變
html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="..
原生JS實現點選一個按鈕顯示一個div,再點選按鈕div隱藏,或點選除div外其它空白處div隱藏
<!DOCTYPE html> <html style="font-size: 24px"> <head> <title>js點選按鈕顯示再點選空白地方隱藏</title> <style type="text/css"&g
點選按鈕,自動瀏覽檔案,選好檔案之後自動上傳
上傳功能在前端應用中經常用到,現在網上很多上傳的外掛,在之前的博文中介紹一個 fileinput外掛,下面就使用簡單的input實現檔案上傳 先看效果: 前臺程式碼: <h2>使用input標籤上傳</h2> <div>
Android studio點選按鈕隱藏頁面後再點選恢復頁面
那如果想要再點選按鈕顯示佈局怎麼辦呢? 設定一個全域性變數tag,初始化=0,onclick2是按鈕的點選事件,呼叫函式,這個函式就是用來控制佈局隱藏還是顯示的,再點選後設置其隱藏還是顯示,接著修改tag的值,這樣下一次點選就會執行另一個按鈕的動作了 public
js點選標題展示內容,再次點選標題關閉內容
<script type="text/javascript"> function show_content(ids){ var content=document.getElementById("content"+ids); content.style.
在Unity裡點選按鈕開啟一個瀏覽器頁面 點選關閉 關閉這個頁面
在Unity裡點選按鈕開啟一個瀏覽器頁面 點選關閉 關閉這個頁面 using UnityEngine; using System.Collections; using System.Diagnostics; public class diaoyong : MonoBeha
專案筆記:點選按鈕後使其保持點選時的狀態
在Web開發時,有不少選項卡切換的例項,當點選一個選項卡時要使其一直保持點選時的狀態,直到點選下一個選項卡切換到另一個選項卡才改變按鈕顏色,之前在專案中有遇到這樣的問題,現在將幾種方法做一總結。 多個選項卡切換 1.使用原生JS切換style 給每一個按鈕新增一個點選事件,
自動點選按鈕(即自動觸發點選事件)
這段時間做專案,有一個特殊的需求,就是介面上有一個按鈕,需要自動去觸發。 找了下資料,發現有個api是可以完成的 就是:sendActionsForControlEvents 這個 下面就是使用方
jquery全選 選中所有checkbox,再次點選取消全選,可以反覆點選,解決了點選一次後再次點選不能選中的問題
<!DOCTYPE html> <html> <head> <title>checkbox的多選</title> </head> <body> <table borde
單選按鈕和標簽組合點擊
center -a microsoft -name 組合 csdn har log int 1、問題背景 現在,有個問題:一組單選按鈕,點擊按鈕可以選中,但是點擊標簽label不能被選中。 2、實現源碼 (1)點擊按鈕選中 <!DOCTYPE ht
點擊左滑動一定距離 再次點擊向右滑動回到原來位置 並且切換點擊圖標
png image chan right tel stop ner over nim $(function(){ var i = $("#right").css("left"); $("#dianji").click(function(){ $("#leftmen
惡意註冊微信或違法;支付寶迴應“勒索病毒”;ofo 退押金按鈕變成灰色 | 極客頭條...
「CSDN 極客頭條」,是從 CSDN 網站延伸至官方微信公眾號的特別欄目,專注於一天業界事報道。風裡雨裡,我們將每天為朋友們,播報最新鮮有料的新聞資訊,讓所有技術人,時刻緊跟業界潮流。 快訊速知 騰訊提醒使用者不要批量惡意註冊微信賬號:可能面臨法律制裁 支
jsp註冊頁面,Ajax實現驗證使用者名稱是否存在,密碼是否一致,當不存在時,註冊按鈕變成灰色。
register.jsp頁面資訊 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>註冊頁面
label+input 選擇(優化多選按鈕)及 input實現全選反選
1、多選, 選擇之後不同的背景, input中 id和label中 for對應的值必須相同 '<label class="inputLable" for=' + item.orderId + '><input type="checkbox" id=' +
按home鍵,再次點選頁面按鈕,回到退出頁面
第一步:去除application中的 android:launchMode=“singleTask” 第二步:然後新增:android:alwaysRetainTaskState=“true” (作用:是否保持原來的狀態。當我們按HOME鍵返回桌面,"true"表示任務棧的狀
問題:通過設定查詢條件,點選按鈕觸發bootstrap-table,觸發以後無法再次觸發
遇到bootstraptable無法重新載入的問題,查閱大神的部落格,找到了解決方案,記錄下,以便查閱。 問題:通過設定查詢條件,點選按鈕觸發bootstrap-table,觸發以後無法再次觸發 解決方案:在初始化table之前,要將table銷燬,否則會保留上次載入的內容 $("#
ABAP 工具欄按鈕可見但不可點選
ABAP應用工具欄上的按鈕需要不活動(不可點選但能顯示,並非隱藏掉),如同標準工具欄上的按鈕一樣。需要設定應用工具欄的屬性:如下圖所示: 第一步:點選應用工具欄的紅綠燈 第二步,設定工應用具欄的屬性為全部顯示 第三步,確認應用工具欄的紅綠燈變為紅色,並且在SET PF_
android avd OK按鈕灰色,無法點選
下午幫夥伴架設了一個android開發環境(eclipse+adt),直接使用Eclipse ADT Bundle,就可以了,完全不需要自己操作什麼。 但在測試能不能使用虛擬機器的時候,卻發現avd建立虛擬機器的時候,發現OK鍵居然是灰色。 在圖中,可以看到No syst