表單元素值獲取方式j(luò)s及java方式的簡(jiǎn)單實(shí)例
大家都知道我們?cè)谔峤籪orm的時(shí)候用了多種input表單??墒遣皇敲恳环Ninput表單都是很簡(jiǎn)單的用Document.getElementById的方式就可以獲取到的。有一些組合的form類似于checkbox或者radio或者select我們?nèi)绾斡胘avascript獲取和在服務(wù)器中獲取提交過來的參數(shù)呢?
多說無用、上代碼:
Jsp-html代碼:
<form action="input.do" name="formkk"> <table> <tbody> <tr> <td>text:</td> <td> <input type="text" name="text"> </td> </tr> <tr> <td>password:</td> <td> <input type="password" name="pass"> </td> </tr> <tr> <td>radio:</td> <td> <input type="radio" name="xingbie" value="1"> 男 <input type="radio" name="xingbie" value="2"> 女 </td> </tr> <tr> <td>checkbox:</td> <td> 足球:<input type="checkbox" name="hobby" value="1" /> 籃球:<input type="checkbox" name="hobby" value="2" /> 拍球:<input type="checkbox" name="hobby" value="3" /> 斗球:<input type="checkbox" name="hobby" value="4" /> </td> </tr> <tr> <td>hidden:</td> <td> <input type="hidden" value="123" name="hidden"/> </td> </tr> <tr> <td>option:</td> <td> <select name="opt" id="opt"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select> </td> </tbody> </table> <input type="button" value="提交" onclick="javascript:check()"/> </form>
Javascript:
function check(){ var radio = document.getElementsByName("xingbie"); var checkbox = document.getElementsByName("hobby"); var select = document.getElementById("opt"); //獲取select標(biāo)簽 var index = select.selectedIndex; var text = select.options[index].text; var value = select.options[index].value; //獲取radio標(biāo)簽 for(var i=0;i<xingbie.length;i++){ if(xingbie.item(i).checked){ var val = xingbie.item(i).getAttribute("value"); break; } continue; } //獲取checkbox標(biāo)簽 for(var i=0;i<hobbys.length;i++){ if(hobbys[i].checked){ alert(hobbys[i].value); } continue; } //提交form表單 document.formkk.submit(); }
Java:
String[] hobbys = request.getParameterValues("hobby"); //checkbox String text = request.getParameter("text"); //text String password = request.getParameter("password"); //password String xingbie = request.getParameter("xingbie"); //radio request.getParameter("hidden"); request.getParameter("opt");//select
以上就是小編為大家?guī)淼谋韱卧刂但@取方式j(luò)s及java方式的簡(jiǎn)單實(shí)例全部?jī)?nèi)容了,希望大家多多支持腳本之家~
相關(guān)文章
微信小程序之高德地圖多點(diǎn)路線規(guī)劃過程示例詳解
這篇文章主要介紹了微信小程序之高德地圖多點(diǎn)路線規(guī)劃過程示例詳解,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-01-01史上最全JavaScript數(shù)組去重的十種方法(推薦)
這篇文章主要介紹了JavaScript數(shù)組去重的十種方法,利用元素的屬性和特性進(jìn)行不同的去重方法,并實(shí)例演示如何測(cè)試去重超大數(shù)組,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下。2017-08-08JS中類的靜態(tài)方法,靜態(tài)變量,實(shí)例方法,實(shí)例變量區(qū)別與用法實(shí)例分析
這篇文章主要介紹了JS中類的靜態(tài)方法,靜態(tài)變量,實(shí)例方法,實(shí)例變量區(qū)別與用法,結(jié)合實(shí)例形式詳細(xì)分析了JS中類的靜態(tài)方法,靜態(tài)變量,實(shí)例方法,實(shí)例變量相關(guān)功能、使用方法及操作注意事項(xiàng),需要的朋友可以參考下2020-03-03JavaScript實(shí)現(xiàn)無限級(jí)遞歸樹的示例代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)無限級(jí)遞歸樹的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03讓 JavaScript 輕松支持函數(shù)重載 (Part 2 - 實(shí)現(xiàn))
在上一篇文章里,我們?cè)O(shè)計(jì)了一套能在JavaScript中描述函數(shù)重載的方法,這套方法依賴于一個(gè)叫做Overload的靜態(tài)類,現(xiàn)在我們就來看看如何實(shí)現(xiàn)這個(gè)靜態(tài)類。2009-08-08JavaScript屏蔽指定區(qū)域內(nèi)右鍵菜單
有時(shí)候需要屏蔽部分區(qū)域內(nèi)的右鍵菜單,下面的代碼大家可以測(cè)試下。2010-03-03JavaScript 字符串與數(shù)組轉(zhuǎn)換函數(shù)[不用split與join]
下面的代碼,不考慮他的運(yùn)行效率的話,思路不錯(cuò),大家可以看看,但在實(shí)際的應(yīng)用中,我們?nèi)匀皇褂胹plit或join來實(shí)現(xiàn)數(shù)組的操作。2009-12-12Bootstrap簡(jiǎn)單表單顯示學(xué)習(xí)筆記
這篇文章主要為大家分享了Bootstrap簡(jiǎn)單表單顯示學(xué)習(xí)筆記,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-11-11