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);
	})