Onchange组合框触发时更改和更新参数值
Onchange组合框触发时更改和更新参数值
提问于 2013-11-07 16:26:11
当在combobox中触发事件onchange时，我遇到了更改url参数的问题。以下是预览：
我的默认url如下：
http://reserv_book.php?id=1 the number id is according to row (from database).当我选择in Cart combobox时，我想根据Combobox值添加参数cart=standard或cart=extra。所以URL更新如下：
http://reserv_book.php?id=1&cart=standard当我选择在Caddy combobox中时，我想根据combobox值添加参数caddy=standard或caddy=extra。所以URL更新如下：
http://reserv_book.php?id=1&cart=standard&caddy=standard下面是当组合框中的onChange事件被触发时调用的函数。
function changeValue(type, id) {
var valCart = document.getElementById("cart").value;
var valCaddy = document.getElementById("caddy").value;
if (type == "cart") {
//alert("Cart : "+val+" , "+id);
$("a.book").each(function() {
var link = "reserv_book.php?id="+id+"&caddy="+ valCaddy +"&cart=";
if (valCart == "standard") {
$(this).attr("href", link + 'standard');
} else {
$(this).attr("href", link + 'extra');
}
});
} else {
//alert("Caddy : "+val+" , "+id);
$("a.book").each(function() {
var link = "reserv_book.php?id="+id+"&cart="+ valCart +"&caddy=";
if (valCaddy == "standard") {
$(this).attr("href", link + 'standard');
} else {
$(this).attr("href", link + 'extra');
}
});
}
}这是combobox中的html文件：
<table width="100%" class="ry-table-gold" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<th>No.</th>
<th>Date</th>
<th>Time</th>
<th>Player(s)</th>
<th>Price</th>
<th>Caddy</th>
<th>Cart</th>
<th> </th>
</tr>
<tr>
<td>1</td>
<td>Oct 28 2013</td>
<td>14:50</td>
<td>3</td>
<td>IDR 450,000.0</td>
<td>
<select id="caddy" onchange="changeValue('caddy',1)">
<option value="standard">Standard</option>
<option value="extra">Extra</option>
</select>
</td>
<td>
<select id="cart" onchange="changeValue('cart',1)">
<option value="standard">Standard</option>
<option value="extra">Extra</option>
</select>
</td>
<td>
<a href="reserv_book.php?id=1" class="ry-btnbook book">Book Now</a>
</td>
</tr>
<tr>
<td>2</td>
<td>Oct 10 2013</td>
<td>14:00</td>
<td>3</td>
<td>IDR 700,000.0</td>
<td>
<select id="caddy" onchange="changeValue('caddy',2)">
<option value="standard">Standard</option>
<option value="extra">Extra</option>
</select>
</td>
<td>
<select id="cart" onchange="changeValue('cart',2)">
<option value="standard">Standard</option>
<option value="extra">Extra</option>
</select>
</td>
<td>
<a href="reserv_book.php?id=2" class="ry-btnbook book">Book Now</a>
</td>
</tr>
</tbody>
</table>另一个问题是，如果第一行中的数据购物车和助手发生了更改。它会影响到另一行。
回答 1
Stack Overflow用户
发布于 2013-11-07 16:44:00
您需要查找最近的tr并搜索表行中的链接。由于您使用的是内联处理程序，因此需要传递额外的参数。
function changeValue(type, id, element) {
var valCart = $("#cart").val(); //use val to get the value of select.
var valCaddy = $("#caddy").val();
if (type == "cart") {
//alert("Cart : "+val+" , "+id);
$(element).closest("tr").find("a.book").each(function() {
var link = "reserv_book.php?id="+id+"&caddy="+ valCaddy +"&cart=";
if (valCart == "standard") {
$(this).attr("href", link + 'standard');
} else {
$(this).attr("href", link + 'extra');
}
});
} else {
...
//same here
}
}HTML
<select id="cart" onchange="changeValue('cart',1, this)">
<option value="standard">Standard</option>
<option value="extra">Extra</option>
</select>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19831026
复制相关文章
相似问题
腾讯云开发者
