[.Net码农,JQuery]使用Jquery 改变及使用<asp:DropDownList>

参考Link: http://stackoverflow.com/questions/19243368/get-dropdown-selected-value-using-jquery

参考Link: http://stackoverflow.com/questions/6059240/getting-selected-value-from-net-dropdown-using-jquery

在页面上定义了一个ASP.Net 控件

<div class="rule-single-select" style="width: 100%;">
	<asp:dropdownlist id="ddlDataCategory" name="DataCategoryId" runat="server">
	</asp:dropdownlist>
</div>

产生的页面代码大概是这样的

<div class="rule-single-select single-select" style="width: 100%;">
	<div class="boxwrap">
		<a class="select-tit" href="javascript:;"><span>货币</span><i></i></a>
		<div class="select-items">
			<ul>
				<li class="selected">无类别</li>
				<li>色彩</li>
				<li>消费</li>
				<li>送货</li>
				<li>货币</li>
			</ul>
		</div>
		<i class="arrow"></i>
	</div>
	<select name="ctl00$mainContent$ddlDataCategory" id="mainContent_ddlDataCategory" style="display: none;">
		<option value="1">无类别</option>
		<option value="2">色彩</option>
		<option value="3">消费</option>
		<option value="4">送货</option>
		<option value="5">货币</option>
	</select>
</div>

通过<%=  ***.ClientID   %>获取自动生成的客户端控件ID

$('#<%= ddlDataCategory.ClientID %>')

改变 <asp:DropDownList>需要改变两个内容 ：1.显示文本修改

$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-tit span').html(
  	$('#<%= ddlDataCategory.ClientID %> option:selected').text());

改变 <asp:DropDownList>需要改变两个内容 ：2.内置选项修改

$('#<%= ddlDataCategory.ClientID %>').val(idvalue);

改变 <asp:DropDownList>其余内容

//成功-清空选择
//$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-items').find("ul li").removeClass("selected");
//成功-设置选择项：由于index和ID_Value值不一样，就不要用了
//$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-items').find("ul li:eq("+index-1+")").addClass("selected");

最后 写上一个这样的JQ涵数 ：绅手党你们好

<script>

  function funSetddlDataCategorySelected(idvalue) {
  	//var boxwrapEm=$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().html();
  	$('#<%= ddlDataCategory.ClientID %>').val(idvalue);
  	//成功-清空选择
  	//$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-items').find("ul li").removeClass("selected");
  	//成功-设置选择项：由于index和ID_Value值不一样，就不要用了
  	//$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-items').find("ul li:eq("+index-1+")").addClass("selected");
  	//成功-改变显示文本
  	$('#<%= ddlDataCategory.ClientID %>  option:selected').parent().parent().find('.select-tit span').html(
  	$('#<%= ddlDataCategory.ClientID %> option:selected').text());
  	//alert($('#<%= ddlDataCategory.ClientID %> option:selected').val());
  	//alert($('#<%= ddlDataCategory.ClientID %> option:selected').text());
  	//alert(boxwrapEm.find('div:first').html());
  } 
</script>