您的位置:首页 > 其它

selected下拉列表常用取值、赋值方法总结

2014-10-30 00:19 375 查看
今天做了一个关于税率的下拉列表,用到很多selected下拉列表的相关技能,现总结如下:

下拉列表代码如下:



<span style="font-size:12px;"><td class='tdLeftHead'>税率</td>
	    <td>
	         <select   id='tax1'  onchange='taxChange(this.value,1,"thirdparty_profit")'   name='thirdparty_taxid'>
			  		<s:if  test="profitList[0].get('THIRDPARTY_TAXID') == -1" > 
			  		    <option selected="selected" value=-1>N/A</option>	
			  		</s:if>
			  		<s:else>
			  		    <option  value=-1>N/A</option>	
			  		</s:else>
			  		  	
		  			 <s:iterator   value="taxTypeList"  status="tar_1" >
		  			     <s:set name="index" value="#tar_1.getIndex()"/>
		  			     <s:set name="id" value="taxTypeList[#index].getId()"/>
		  			     <s:set name="taxid" value="profitList[0].get('THIRDPARTY_TAXID')"/>
		  			     
		  			     <s:if  test="#taxid  !=  #id " > 
		  			 		 <option    value='<s:property value="taxTypeList[#index].getId()" />'  >
			  					 <s:property value="taxTypeName"  />
			  				 </option>	
			  		     </s:if>
			  		     <s:else>
			  		         <option   selected="selected"  value='<s:property value="taxTypeList[#index].getId()" />'> <s:property value="taxTypeName"  /></option>
			  		     </s:else>
		   			 </s:iterator> 
			  </select>
		</td></span>


常用取值方法:

var myselect=document.getElementById("tax"+i); // 获取下拉列表对象

var myIndex=myselect.selectedIndex ; // 获取下拉列表当前索引

var taxId = myselect.options[myIndex].value; // 获取当前索引对应的option选项value值

var taxText = myselect.options[myIndex].text; // 获取当前索引对应的option选项文本框内容值

在JS中更改展示option选项方法:传入你想展示的选项对应的value值即可。

$("#tax1").val(value); // 选中下拉列表,给其传option选项value值,就会展示该value值对应索引的内容值。



增加一个选项的方法:

<span style="font-size:14px;">     var option=document.createElement("option");
     option.text="nami";
     option.value="nami1";
     var x=document.getElementById("mySelect");
     try
     {
          x.add(option,null); // 标准实现
     }
     catch(ex)
     {
          x.add(option); // 仅在IE中实现
     }</span>


jquery禁用select和取消禁用:

$("#channelplatform").removeAttr("disabled");

$("#channelplatform").attr("disabled","disabled");

添加就是attr

取消则是reomveAttr(注意A大写)

将引入功能(将一张接口表中数据,引入到税率表中)相关JSP代码贴出来,以后可以翻看怎么在JS中取出下拉列表的对象及其属性值。

<span style="font-size:14px;"> function doInto(){  
  	var TP_TAX_RATE = $("#taxAisas1").val();
	var OP_TAX_RATE = $("#taxAisas2").val();
	var OS_TAX_RATE = $("#taxAisas3").val();
	var TR_TAX_RATE = $("#taxAisas4").val(); 
	var TP_AMOUNT = $("#dealAisasPrice1").val();
	var OP_AMOUNT = $("#dealAisasPrice2").val();
	var OS_AMOUNT = $("#dealAisasPrice3").val();
	var TR_AMOUNT = $("#dealAisasPrice4").val(); 
		
	$('#dealPrice1').val(TP_AMOUNT);
	$('#dealPrice2').val(OP_AMOUNT);
	$('#dealPrice3').val(OS_AMOUNT);
	$('#dealPrice4').val(TR_AMOUNT);

        var flag_TP = false;
	var flag_OP = false;
        var flag_OS = false;
	var flag_TR = false;  
        var id1,id2,id3,id4; 

        <s:iterator   value="taxTypeList" >
	      <s:set name="index" value="#tar_1.getIndex()"/>
		  <s:set name="id" value="taxTypeList[#index].getId()"/>
		  <s:set name="taxTypeName" value="taxTypeList[#index].getTaxTypeName()"/>

                 ——这里的id1即为option选项对应的value值
                 if(TP_TAX_RATE=='<s:property value="taxTypeName" />'){
			  id1= '<s:property value="id"  />'
			  flag_TP = true; 
		  }
		  if(OP_TAX_RATE=='<s:property value="taxTypeName" />'){
			  id2= '<s:property value="id"  />'
			  flag_OP = true;
		  }
		  if(OS_TAX_RATE=='<s:property value="taxTypeName" />'){
			  id3= '<s:property value="id"  />'
			  flag_OS = true; 
		  }
		  if(TR_TAX_RATE=='<s:property value="taxTypeName" />'){
			  id4= '<s:property value="id"  />'
			  flag_TR = true;
		  }
       </s:iterator>  

       ——给selected下拉框设置value值,即可切换为我们希望展示的文本框内容
       $("#tax1").val(id1);
       $("#tax2").val(id2);
       $("#tax3").val(id3);
       $("#tax4").val(id4); 

       taxChange(id1,1,"thirdparty_profit");
       taxChange(id2,2,"selfserv_profit");
       taxChange(id3,3,"softwareserv_profit");
       taxChange(id4,4,"train_serv_profit");
		    
       if(!flag_TP){
	   alert(TP_TAX_RATE + '税率不存在。');
	   return false;
       }
       if(!flag_OP){
	   alert(OP_TAX_RATE + '税率不存在。');
	   return false;
       } 
       if(!flag_OS){
	   alert(OS_TAX_RATE + '税率不存在。');
	   return false;
       } 
       if(!flag_TR){
	   alert(TR_TAX_RATE + '税率不存在。');
	   return false;
       }	
   		
 } </span>


用class对多个下拉列表的值进行重复校验:

$('.company').each(function(){
			var bu = $(this).parent().parent().find('.bu');
			if($(this).val()!=''&&bu.val()!=''){ 
				var company = $(this).val();
				var bu = bu.val();
				var bcStr = company + bu;   
				if(bcArray.length > 0)
				{
					for(var i=0;i<bcArray.length;i++)
					{ 
						if(bcArray[i] == bcStr)
						{ 
							var companySelect=$(this); 
							var companyIndex=companySelect[0].selectedIndex ;  
							var companyText = companySelect[0].options[companyIndex].text;  
							var buSelect = $(this).parent().parent().find('.bu')
							var buIndex=buSelect[0].selectedIndex ;   
							var buText = buSelect[0].options[buIndex].text; 
							alert("签约方:"+companyText+"和BU:"+buText+"已经存在,请检查数据。");
							flag=false;
							break; 
						}
					} 
					if(flag)
					{  
						bcArray.push(bcStr); 
					}
					else
					{ 
						return false;
					}
				}
				else
				{
					bcArray[0] = bcStr;
				} 
				
				
			}
		})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: