點(diǎn)擊提交按鈕后按鈕變灰色不可用狀態(tài)的三種方法
更新時(shí)間：2013年09月16日 22:21:42 作者：
當(dāng)點(diǎn)擊提交后，提交按鈕變灰色不可用，這樣可有效防止重復(fù)提交，本代碼就是實(shí)現(xiàn)這樣一個(gè)功能
第一種方法：直接按鈕中加入
當(dāng)點(diǎn)擊提交后，提交按鈕變灰色不可用，這樣可有效防止重復(fù)提交，本代碼就是實(shí)現(xiàn)這樣一個(gè)功能。從代碼就可以看出，我們只需在提交按鈕上加入這一句： onclick="javascript:{this.disabled=true;document.form1.submit();}"，意思是當(dāng)按鈕點(diǎn)擊后，將按鈕的不可用屬性設(shè)置為true，這樣按鈕就變灰了
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
第二種方法：通過onSubmit事件實(shí)現(xiàn)，并且可以將變灰按鈕變?yōu)榭捎?/STRONG>
在form里面添加 onSubmit事件，如果表單加入了判斷，那么這個(gè)方法直接就可以用了，記住就放到最后，否則一開始就為灰了，但我們加上了一個(gè)使提交按鈕變?yōu)榭捎玫拇a，
即可防止重復(fù)提交信息，也可以防止代碼問題導(dǎo)致不可提交的情況
復(fù)制代碼 代碼如下:
<form name=form1 action="" onSubmit=" return closebut()" >
<input name="imageField" type="submit" class="inputbut" value="確定" /><br>
<input type="button" name="hui" id="hui" value="讓提交按鈕可用" onclick="document.form1.imageField.disabled=false" />
</form>
<script>
function closebut(){
document.form1.imageField.disabled=true;
}
</script>
第三種，跟上面的類似
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
淺析js實(shí)現(xiàn)網(wǎng)頁截圖的兩種方式
這篇文章主要介紹了淺析js實(shí)現(xiàn)網(wǎng)頁截圖的兩種方式，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)簡(jiǎn)易ATM功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-10-10
js獲取網(wǎng)頁可見區(qū)域、正文以及屏幕分辨率的高度
這篇文章主要介紹了js獲取網(wǎng)頁的各種高度，例如可見區(qū)域、正文以及屏幕分辨率的高度,需要的朋友可以參考下2014-05-05
這篇文章主要介紹了js設(shè)置文字顏色的方法,涉及JS頁面元素樣式操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-12-12
利用js動(dòng)態(tài)加載js文件到頁面，并在確定加載完成后調(diào)用相關(guān)function2011-07-07
JS逆向之?webpack?打包站點(diǎn)實(shí)戰(zhàn)原理分享
本文主要介紹了JS逆向之webpack打包站點(diǎn)實(shí)戰(zhàn)原理分享，webpack是前端程序員用來進(jìn)行打包JS的技術(shù)，打包之后的代碼特征非常明顯，更多相關(guān)知識(shí)需要的小伙伴可以參考下面文章詳細(xì)內(nèi)容2022-06-06
JS實(shí)現(xiàn)將鏈接生成二維碼并轉(zhuǎn)為圖片的方法
這篇文章主要介紹了JS實(shí)現(xiàn)將鏈接生成二維碼并轉(zhuǎn)為圖片的方法,涉及qrcodejs插件及js圖片生成相關(guān)操作技巧,需要的朋友可以參考下2018-03-03
js實(shí)現(xiàn)同一個(gè)頁面多個(gè)漸變效果的方法
這篇文章主要介紹了js實(shí)現(xiàn)同一個(gè)頁面多個(gè)漸變效果的方法,涉及javascript操作漸變效果的實(shí)現(xiàn)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
Next.js解決axios獲取真實(shí)ip問題方法分析
這篇文章主要介紹了Next.js解決axios獲取真實(shí)ip問題方法分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09
這篇文章主要介紹了BootStrap入門教程(三)之響應(yīng)式原理的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧2016-09-09