模板無憂
網頁特效
每日更新
|
TOP排行榜
|
Tag標簽
|
充值
無憂首頁
網頁模板
程序模板
建站教程
視頻教程
網頁特效
圖標素材
字體下載
站長工具
站長問答
網頁特效
菜單導航
圖片特效
文本鏈接
層和布局
頁面背景
表單按鈕
日期時間
計算轉換
鍵盤鼠標
瀏覽器
游戲娛樂
綜合其它
常用代碼
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在線編輯器
Mootools
HTML
JS廣告代碼合集
站長工具
站長常用軟件
網站綜合查詢
Alexa排名查詢
Google PR查詢
域名Whois查詢
網站收錄查詢
友情鏈接查詢
CSS2中文手冊
CSS精簡優化工具
網頁特效代碼
模板無憂
>
網頁特效
>
表單按鈕特效代碼
>
收藏
分享
查看評論
表單按鈕
演示
在下拉列表框中使用復選框_表單按鈕特效
查看演示效果
特效Tag：
暫無Tag,歡迎
添加
,賺取U幣!
在一組下拉列表框中使用checkbox復選框，有時候或許我們要用到這種功能，不妨收藏一下。
<html> <head> <title>在下拉列表框中使用復選框</title> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312"> </head> <style> body,td{font-size:12px;color:#000000;} .checkbox{width:15px;height:15px;} .cked{ margin:1px;padding:2px;width:98%;display:block;background-color:highlight;color:highlighttext; } .nock{ margin:1px;padding:2px;width:98%;display:block; } </style> <body> <SCRIPT LANGUAGE="JavaScript"> <!-- function HtmlEncode(text){ return text.replace(/&/g, '&').replace(/\"/g, '"').replace(/</g, '<').replace(/>/g, '>'); } function _checkbox(name,str,defv){ //haiwa@2005-8-17 //http://www.51windows.net var arr=str.split("^"); var ck="",bc=""; for(var i=0;i<arr.length;i++){ var thisarr=arr[i].split("@="); if (thisarr[0].length>0){ var t=(thisarr.length==2)?thisarr[0]:arr[i]; var v=(thisarr.length==2)?thisarr[1]:arr[i]; if((","+HtmlEncode(defv).toLowerCase()+",").replace(/ ,/g, ',').indexOf(","+v+",")!=-1){ck=" checked";cls="cked";} else{ck="";cls="nock";} var thisstr="<label class=\""+cls+"\" for=\"i_"+name+"_"+i+"\" id=\"l_"+name+"_"+i+"\">"; thisstr+="<input class=\"checkbox\" onpropertychange=\"document.getElementById('l_"+name+"_"+i+"').className=(document.getElementById('i_"+name+"_"+i+"').checked)?'cked':'nock';\" onclick=\"document.getElementById('l_"+name+"_"+i+"').className=(document.getElementById('i_"+name+"_"+i+"').checked)?'cked':'nock';\" type=\"checkbox\""+ck+" name=\""+name+"\" id=\"i_"+name+"_"+i+"\" value=\""+HtmlEncode(v)+"\" \/> "; thisstr+=HtmlEncode(t)+"</label>"; document.write(thisstr); } } } function _getv(o){ var allvalue=""; if(typeof(o)=="undefined"){return "";} if (typeof(o.length)=="undefined"){ if(o.checked){return o.value+ ",";}else{return "";} } for(var i=0;i<o.length;i++){ if(o[i].checked){ allvalue +=o[i].value+","; } } return allvalue; } function _setv(o,defv){ var allvalue=(","+HtmlEncode(defv).toLowerCase()+",").replace(/ ,/g, ','); for(var i=0;i<o.length;i++){ var v = o[i].value; o[i].checked=(allvalue.indexOf(","+v+",")!=-1) } return allvalue; } function _sl(o,b){ for(var i=0;i<o.length;i++){ o[i].checked = b //if(o[i].checked!=b){o[i].click();} } } //--> </SCRIPT> <form method="post" name="myform" action="?"> <table border="0" width="200"> <tr> <td><div style="width:180px;height:150px;overflow:auto;border: 2px inset #FFFFFF;"> <SCRIPT LANGUAGE="JavaScript"> <!-- _checkbox("city","北京^河北^黑龍江^河南^江西^遼寧^寧夏^四川^天津^浙江^香港","北京,山東") //--> </SCRIPT></div> </td> </tr> <tr> <td> <button onclick='_sl(document.myform.city,true);'>全選</button> <button onclick='_sl(document.myform.city,false);'>全不選</button> <button onclick='_setv(document.myform.city,"甘肅,廣東");'>set值</button> <button onclick='alert(_getv(document.myform.city));'>get值</button> </td> </tr> <tr> <td><div style="width:180px;height:120px;overflow:auto;border: 2px inset #FFFFFF;"> <SCRIPT LANGUAGE="JavaScript"> <!-- _checkbox("WebSite","Google.com@=http://www.google.com^Blueidea.com@=http://www.blueidea.com^mb5u.com@=/","/") //--> </SCRIPT></div> </td> </tr> <tr> <td> <button onclick='_sl(document.myform.WebSite,true);'>全選</button> <button onclick='_sl(document.myform.WebSite,false);'>全不選</button> <button onclick='_setv(document.myform.WebSite,"http://www.google.com");'>set值</button> <button onclick='alert(_getv(document.myform.WebSite));'>get值</button> </td> </tr> <tr> <td align="center"><button onclick='document.myform.reset();'>重置</button> </td> </tr> </table> </form> </body> </html>
所屬頻道：
表單按鈕特效
/
更新時間：2013-04-17
[收藏]
[報錯]
[返回列表]
相關
表單按鈕特效
：
又一個帶描述的表單
可自由移動位置的導航條
頁面轉跳。跟本站的教學文章中的那些轉到第幾頁一樣的
帶Checkbox的列表框
提供四種打開新窗的形式
自動復制代碼
方便登錄各種管理頁面以及任何EMAIL量身定做！
QQ分類搜索代碼
查找表格的內容
一個帶描述的表單
常用email檢驗函數
file框模擬新解
表單按鈕特效Rss訂閱
特效代碼搜索
表單按鈕特效推薦
JS輸入限制，不符要求不能輸入的代碼
雙擊編輯可修改狀態的JS實現
JavaScript生成復雜的SQL查詢表單
點擊按鈕后加載進度條
滾動條拖動評分的JS效果
一個帶提示的Ajax驗證表單
注冊閱讀條款時定時激活的按鈕
點擊單選框將值添加至文本輸入框
將下拉框的選中值自動加入到文本框
CSS 3D立體按鈕
猜你也喜歡看這些
JavaScript計算當月剩余天數
星期查詢！可設置任意、年、月、日 ！！
時間跳動器
DATE對象增強特性
帶顯示走動時間的超級酷掛歷
查找是星期幾
JS倒計時代碼
JS讓你網頁版權處的時間自動更新
Js日期選擇并自動加入輸入框
JavaScript自動將選擇的時間填入文本框
相關鏈接：
復制本頁鏈接
|
搜索在下拉列表框中使用復選框
特效說明：
表單按鈕模板
-
在下拉列表框中使用復選框
。
。。