在網頁中遍歷出來的每行都有一個select，怎麼才能將對應select選中的內容傳遞到各行對應的編輯（a標籤）內，點選後將引數內容傳遞到servlet中，進行操作。

實現效果圖如下：

思路：將每行的材料編號除了給材料編號那一列顯示之外，同樣也賦給調入倉庫和編輯標籤，用於區分每行不同的下拉框和a標籤。通過js（window.onload）在頁面載入完成後，執行，獲取所有select，然後利用迴圈遍歷出所有的下拉框，然後寫出每個下拉框的onchange事件，獲取編號相同的a標籤，然後獲取其href，然後將需要新增的引數通過字串替換新增到a標籤的href中：

window.onload = function() {
		var sels = document.getElementsByName("selects "); // 得到所有的select集合
		for(var i = 0;i < selects.length; i++) {
			selects [i].onchange = function() { // 事件繫結
				var submit = document.getElementById(this.title); // 確定按鈕
				var url = submit.href; // url
				var index = this.selectedIndex; // 下拉框選中的索引
				var value = this.options[index].text; // 下拉框中值
				url = url.replace("&remove_newWare =", "& remove_newWare ="+value);
			}
		}
	}
 

Jsp頁面表格程式碼：

<c:forEach items="${pb.beanList }" var="material" varStatus="i">
	<tr class="tableItem">
	<td >${material.material_id }</td>
	<td>${material.material_name }</td>
	<td>材料</td>
	<td>${material.material_count }</td>
	<td>${material.warehouse_id }</td>
	<td>
	   	<select name="selects" title="${material.material_id }">
	   		<option>--請選擇--</option>
	   		<c:forEach items="${listWarehouse }" var="warehouseid">
		   	<option value="${warehouseid.warehouse_id }">${warehouseid.warehouse_id }</option>
	   		</c:forEach>		   		
	   	</select>
	</td>
	<td>${rcount[i.count-1] }</td>
	<td><a href="${ctx }/removes.do?method=editRemovesMaterial&material_id=${material.material_id &remove_newWare=" id="${material.material_id }">確認</a></td>						
 	</tr>
</c:forEach>
 

這樣過後，確實能將下拉框中選中的值，傳到每行對應的a標籤中，但是這裡又發現一個問題，就是如果我第一次選擇後，沒有提交，而是再次選擇或者多次重新選擇，那麼a標籤中remove_newWare就會被多次替換導致，最終有多個選中的值出現在它的後面。所以這裡需要改進，下面是改進後的程式碼。

window.onload = function() {
 		var sels = document.getElementsByName("selects"); // 得到所有的select, 集合
		for(var i = 0;i < sels.length; i++) {
			sels[i].onchange = function() { // 事件繫結			
				var submit = document.getElementById(this.title); // 確定按鈕
				var url = submit.href; // url
				function GetQueryString(name){
				    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");//構造一個含有目標引數的正則表示式物件
				    var r = url.substr(1).match(reg);//匹配目標引數
				    if(r!=null)return  unescape(r[2]); return null;//返回引數值
				}
				var removeNew = GetQueryString("remove_newWare");				
				if(removeNew==null||removeNew==""){
					var index = this.selectedIndex; // 下拉框選中的索引
					var value = this.options[index].text; // 下拉框中值
					url = url.replace("&remove_newWare=&", "&remove_newWare="+value+"&");
					submit.setAttribute('href', url);
				}else{
					var index = this.selectedIndex; // 下拉框選中的索引
					var value = this.options[index].text; // 下拉框中值
					url = url.replace("&remove_newWare="+removeNew+"&", "&remove_newWare="+value+"&");
					submit.setAttribute('href', url);
				}
			} 
		}
 

二.多個下拉框

在實際運用中，我們還可能遇到，多個下拉框的情況，且第二個下拉框需要通過第一個下拉框的值確定，然後將第二個下拉框的值傳給a標籤。那麼這種情況又該怎麼實現呢？

思路：首先我們可以通過選擇第一個下拉框中的值，將該值通過js獲取，然後將獲取的值通過ajax傳遞到servlet，通過方法查詢到，相應第二個下拉框需要的值，然後通過json傳到頁面，然後將相應的值新增到select中，然後通過上面的方法，將值傳遞給對應的a標籤。

但是在實際過程中，我又遇到了一個問題，就是我已經使用title和id，那麼這裡多了一個select，我又該怎麼將編號的值給它呢，我想到了class，但是使用了class之後，我發現通過var sonselect引數並不能使用，於是我查了相關資料，知道了原來要是用class必須在後面加上對應的[]，才能使用，因為class可能有多個，使用時需要知道它的準確位置。

jsp程式碼：

<c:forEach items="${pb.beanList }" var="product" varStatus="i">
     <tr class="tableItem">
	<td>${product.product_id }</td>
	<td>${product.product_name }</td>
	<td>產品</td>
	<td>${product.product_count }</td>
	<td><span>${product.warehouse_id }</span><span>${product.shelf_id }</span></td>
	<td>
	    <select name="seles" title="${product.product_id }">
		<option>--請選擇--</option>
		<c:forEach items="${listWarehouse }" var="warehouseid">
		<option value="${warehouseid.warehouse_id }" id="${warehouseid.warehouse_id }">${warehouseid.warehouse_id }</option>
		</c:forEach>   		
	    </select>
	    <select class="${product.product_id }" name="selesa">
		<option>--請選擇--</option>		   		
	    </select>
	</td>
	<td>${rcount[i.count-1] }</td>
	<td><a href="${ctx }/removes.do?method=editRemovesProduct&remove_newShelf=" id="${product.product_id }">確認</a></td>
     </tr>
</c:forEach>	

下面是js程式碼：

var seles = document.getElementsByName("seles"); // 得到所有的select, 集合
		for(var i = 0;i < seles.length; i++) {
			seles[i].onchange = function() { 
				var sonselect = document.getElementsByClassName(this.title);//確定子下拉框
				var index = this.selectedIndex; // 下拉框選中的索引
				var value = this.options[index].text; // 下拉框中值
				setWare(sonselect,value);
		
				var title = this.title;
				sonselect[0].onchange = function(){		
					var submit = document.getElementById(title);
					var url = submit.href; // url
					function GetQueryString(name){
					    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");//構造一個含有目標引數的正則表示式物件
					    var r = url.substr(1).match(reg);//匹配目標引數
					    if(r!=null)return  unescape(r[2]); return null;//返回引數值
					}
					var removeNew = GetQueryString("remove_newShelf");	
					if(removeNew==null||removeNew==""){
						var index = this.selectedIndex; // 下拉框選中的索引
						var value = this.options[index].text; // 下拉框中值
						url = url.replace("&remove_newShelf=&", "&remove_newShelf="+value+"&");
						submit.setAttribute('href', url);
					}else{
						var index = this.selectedIndex; // 下拉框選中的索引
						var value = this.options[index].text; // 下拉框中值
						url = url.replace("&remove_newShelf="+removeNew+"&", "&remove_newShelf="+value+"&");
						submit.setAttribute('href', url);
					}
				}
			}
		}
	}
	function setWare(selectid,pid){
		  $.ajax({
			  	type: "POST",
			  	url: "${ctx}/removes.do",
			    data: "method=getShelfId&warehouse_id="+pid,
			    async: false,
	            success : function(msg) {
	            	 for(var i = 0;i< msg.length;i++){
			//建立option元素節點
				var opEle = document.createElement("option");
				$(opEle).append("<option value='"+msg[i]+"'>"+msg[i]+"</option>");
				//將option元素節點追加到第二個下拉列表中去
				$(opEle).appendTo($(selectid));
			}
	            },
	            dataType:"json"
	        });
	}

Servlet方法中的程式碼，我就不貼了，大家對以上的內容有什麼疑問可以和我交流討論。