selection添加option並放在最後一項
html代碼:
<form><select name="location" id="location"><option value="beijing1">beijing</option><option value="shanghai1">shanghai</option><option value="chengdu1">chengdu</option><option value="changsha1">changsha</option></select></form>
js代碼:
var select=document.forms[0].elements['location'];
第一種方法:添加單選選項
var newOption=document.createElement('option');var newText=document.createTextNode('guangzhou');newOption.appendChild(newText);newOption.setAttribute('value','guangzhou');select.appendChild(newOption);第二種方法:也是添加單選選項,是不是簡單很多了,哈哈但是不兼容IE8及以上版本
var newsOption=new Option('nanchang1','nanchang');select.appendChild(newsOption);第三種方法:添加單選框看看,最佳方案,這個又方便又兼容
var nnewOption=new Option('fengcheng1','fengcheng');select.add(nnewOption,undefined);移除選項:
第一種方法:select.remove(i);//index從0開始
第二種方法:select.options[i]=null;
第三種方法:select.removeChild(select.options[i])
下面給大家介紹三種取消選中單選框radio的方法
本文依賴於jQuery,其中第一種,第二種方式是使用jQuery實現的,第三種方式是基於JS和DOM實現的。
<!DOCTYPE HTML> <html> <head> <title>單選按鈕取消選中的三種方式</title> <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"> </script> <script type="text/javascript"> $(function(){ // var $browsers = $("input[name=browser]"); var $cancel = $("#cancel"); var $byhide = $("#byhide"); var $remove = $("#remove"); // $cancel.click(function(e){ // 移除屬性,兩種方式都可//$browsers.removeAttr("checked"); $browsers.attr("checked",false); }); // $byhide.click(function(e){ // 切換到一個隱藏域,兩種方式均可//$("#hidebrowser").attr("checked",true); $("#hidebrowser").attr("checked","checked"); }); // $remove.click(function(e){ // 直接去的DOM元素,移除屬性// 如果不使用jQuery,則可以移植此方式var checkedbrowser=document.getElementsByName("browser"); /* $.each(checkedbrowser, function(i,v){ v.checked = false; v.removeAttribute("checked"); }); */// var len = checkedbrowser.length; var i = 0; for(; i < len; i++){ // 必須先賦值為false,再移除屬性checkedbrowser[i].checked = false; // 不移除屬性也可以//checkedbrowser[i].removeAttribute("checked"); } }); }); </script> </head> <body> <p>您喜歡哪款瀏覽器? </p> <form> <input style="display:none;" id="hidebrowser" type="radio" name="browser" value=""> <input type="radio" name="browser" value="Internet Explorer">Internet Explorer<br /> <input type="radio" name="browser" value="Firefox">Firefox<br /> <input type="radio" name="browser" value="Netscape">Netscape<br /> <input type="radio" name="browser" value="Opera">Opera<br /> <br /> <input type="button" id="cancel" value="取消選中方式1" size="20"> <input type="button" id="byhide" value="取消選中方式2" size="20"> <input type="button" id="remove" value="取消選中方式3" size="20"> </form> </body> </html>以上所述是小編給大家介紹的表單中單選框添加選項和移除選項,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!