使用Jquery选择两个Dropdown值

时间：2012-09-27 07:01:50

标签： javascript jquery jquery-plugins

我有一个dropwdown，我需要使用Jquery获取值。

请参阅我手表中的复制粘贴行：

-       $("[id$='ddlEmployee']")    {...}   Object
+       [Methods]       
+       [0] {Count = 4} DispHTMLSelectElement
+       [1] {Count = 4} DispHTMLSelectElement
+       context {object}    DispHTMLDocument
        jquery  "1.7.2" String
        length  2   Number
+       prevObject  {...}   Object
        selector    "[id$='ddlEmployee']"   String

控件名是ddlEmployee，因为在同一页面中有两个ddlEmployees，它有两个数组[0]和[1] ..你可以从上图中看到

每个数组都有选定的值。 （该页面的第一个和第二个下拉列表）。

我想获得每个下拉列表的选定值

我在下面尝试过：但没有工作

  1. $（“[id $ ='ddlEmployee']”）[0] .value此值将始终是第一个下拉列表第一项
  2. $（“[id $ ='ddlEmployee']”）[0] [0] .value这也与上面第一个下拉第一项相同
  3. $（“[id $ ='ddlEmployee']”）[0] [0] .val（）对象不支持此属性或方法错误
  4. $（“[id $ ='ddlEmployee']”）[0] .val（）对象不支持此属性或方法错误
  5. $（“[id $ ='ddlEmployee']”）[1] .val（）对象不支持此属性或方法错误
  6. $（“[id $ ='ddlEmployee']”）。text（）“ - 选择 - 值1值2值3 - 选择 - 值1值2值3”字符串
  7. $（“[id $ ='ddlEmployee']”）[0] .text（）对象不支持此属性或方法错误
  8. $（“[id $ ='ddlEmployee']”）[1] .text（）对象不支持此属性或方法错误

    9. 只有第六点我才有所收获。但这还不足以区分选定值的下拉列表。

    如何编写代码，选择第一个和第二个下拉列表的值？

    请参阅下面的HTML代码：

    <DIV class="datagrid margin-10px-left margin-10px-right"><DIV>
<TABLE style="WIDTH: 100%; BORDER-COLLAPSE: collapse" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa class=datagrid border=1 rules=all cellSpacing=0>
<TBODY>
<TR>
<TH style="WIDTH: 90px" scope=col>DOA Name *</TH>
<TH scope=col>DOA For</TH>
<TH style="WIDTH: 80px" scope=col>Start Date *</TH>
<TH style="WIDTH: 80px" scope=col>End Date *</TH>
<TH scope=col>Remarks</TH>
<TH scope=col>&nbsp;</TH></TR>
<TR>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_txtName class=validate[DOAGridrequired] value="Fin Jack Uppal" readOnly type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$txtName jQuery17205721116313179826="5"> <A id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_lnkAddEmployee class=margin-20px-left href="javascript:__doPostBack('ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$lnkAddEmployee','')">Select</A> <!-- Added for Grid Level Ajax    --><!-- End of Grid Level Ajax  --></TD>
<TD><SELECT style="WIDTH: 120px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_ddlDOAFor class=validate[required] name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$ddlDOAFor jQuery17205721116313179826="6"> <OPTION value=0>- Select -</OPTION> <OPTION selected value=TravelAuthorization>TravelAuthorization</OPTION> <OPTION value=ExpenseReporting>ExpenseReporting</OPTION></SELECT> </TD>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_txtStartDate class=validate[DOADaterequired,DOApast[NOW],DOAdateRange[grp1],DateAddedXDays[21],custom[dd/mm/yyyy]] value=27/09/2012 type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$txtStartDate jQuery17205721116313179826="7"> <INPUT style="BORDER-RIGHT-WIDTH: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_imgCal src="/Style%20Library/images/icon-cal.gif" type=image name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$imgCal> </TD>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_txtEndDate class=validate[DOADaterequired,DOApast[NOW],DOAdateRange[grp1],DateAddedXDays[21],custom[dd/mm/yyyy]] value=27/09/2012 type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$txtEndDate jQuery17205721116313179826="8"> <INPUT style="BORDER-RIGHT-WIDTH: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_imgCal3 src="/Style%20Library/images/icon-cal.gif" type=image name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$imgCal3> </TD>
<TD><TEXTAREA style="WIDTH: 100%" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl02_txtRemark class="validate[maxSize[250],DOARemarksInsidePage ]" rows=2 cols=20 name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl02$txtRemark jQuery17205721116313179826="9"></TEXTAREA> </TD>
<TD><A href="javascript:__doPostBack('ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa','Select$0')"><IMG title="Remove row" border=0 src="/Style Library/images/icon-delete.gif"></A></TD></TR>
<TR style="BACKGROUND-COLOR: #f2f2f2" class=alt>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_txtName class=validate[DOAGridrequired] value="CCA Kanokporn Choochan" readOnly type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$txtName jQuery17205721116313179826="10"> <A id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_lnkAddEmployee class=margin-20px-left href="javascript:__doPostBack('ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$lnkAddEmployee','')">Select</A> <!-- Added for Grid Level Ajax    --><!-- End of Grid Level Ajax  --></TD>
<TD><SELECT style="WIDTH: 120px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_ddlDOAFor class=validate[required] name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$ddlDOAFor jQuery17205721116313179826="11"> <OPTION value=0>- Select -</OPTION> <OPTION selected value=TravelAuthorization>TravelAuthorization</OPTION> <OPTION value=ExpenseReporting>ExpenseReporting</OPTION></SELECT> </TD>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_txtStartDate class=validate[DOADaterequired,DOApast[NOW],DOAdateRange[grp1],DateAddedXDays[21],custom[dd/mm/yyyy]] value=27/09/2012 type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$txtStartDate jQuery17205721116313179826="12"> <INPUT style="BORDER-RIGHT-WIDTH: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_imgCal src="/Style%20Library/images/icon-cal.gif" type=image name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$imgCal> </TD>
<TD><INPUT id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_txtEndDate class=validate[DOADaterequired,DOApast[NOW],DOAdateRange[grp1],DateAddedXDays[21],custom[dd/mm/yyyy]] value=27/09/2012 type=text name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$txtEndDate jQuery17205721116313179826="13"> <INPUT style="BORDER-RIGHT-WIDTH: 0px; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_imgCal3 src="/Style%20Library/images/icon-cal.gif" type=image name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$imgCal3> </TD>
<TD><TEXTAREA style="WIDTH: 100%" id=ctl00_PlaceHolderMain_SPWebPartManager_g_00ed9bd7_7fe8_45be_a81e_9898c9819caf_ctl00_gdvDoa_ctl03_txtRemark class="validate[maxSize[250],DOARemarksInsidePage ]" rows=2 cols=20 name=ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa$ctl03$txtRemark jQuery17205721116313179826="14"></TEXTAREA> </TD>
<TD><A href="javascript:__doPostBack('ctl00$PlaceHolderMain$SPWebPartManager$g_00ed9bd7_7fe8_45be_a81e_9898c9819caf$ctl00$gdvDoa','Select$1')"><IMG title="Remove row" border=0 src="/Style Library/images/icon-delete.gif"></A></TD></TR></TBODY></TABLE></DIV></DIV>

1 个答案:

答案 0 :(得分：3)

jsFiddle Demo

使用[ ]索引返回底层DOM对象，该对象不是jQuery对象，因此不支持jQuery方法。使用jQuery方法.eq()：

过滤集合 
$("[id$='ddlEmployee']").eq(0).val();
$("[id$='ddlEmployee']").eq(1).val();
相关问题
最新问题