jquery獲取兄弟結點的input框內的val值

有時候我們可能想在網站上實現一個類似於加減數量的小demo。

我們來看下html程式碼:

		        <c:forEach items="${arrlist}" var="shop">
					<tr class="text-align" id="shop_"${shop.getShopid()}>
						<td><div><img src="${shop.getUrl()}shop0.png" class="shopping_img"> <p class="text-align">${shop.getName()}</p></div></td>
						<td>${shop.getPrice()}</td>
						<td style="width:15%">
							<div class="number">
							<div class='button1' id='btn${shop.getShopid()}'>-</div>
							<div><input type='text' class='num_input1' id='input${shop.getShopid()}' value="1"></div>
							<div class='button2' id='btn_${shop.getShopid()}'>+</div>
							</div>
						</td>
						<td>${shop.getNum()}</td>
						<td>
						${shop.getPrice()*1}
						</td>
						<td></td>
					</tr>
				</c:forEach>
 

我們為點選的+和-按鈕新增事件，改變inout框的val值，

注意不能用jq的$(this).next().firstChild()找到input標籤;

而應該用$(this).next().find("input");找到input標籤。可能瀏覽器在解析的時候沒有把input標籤當作div的孩子結點。

所以應該在div下find下這個input標籤。

	$(".button1").on('click',function(){
		var x1=$(this).next().find("input");
		var y=parseInt(x1.val());
		y-=1;
		x1.val(y);
	})