我的代码有问题。我想在组合框的值更改时更改价格,但在while循环处理程序中,只处理第一个表行。
<script type="text/javascript">
$(document).ready(function () {
$('#size').change(function () {
//alert("aaa");
var x = $('#size').attr('value');
//alert(x);
$.ajax({
type: "POST",
url: 'sizeChange.php',
data: 'size =' + size,
success: function (data) {
alert(data);
}
})
});
});
</script>
<div id="price">
<table border="1" width="200px">
<tr>
<td> Size </td>
<td> Product</td>
<td>Price</td>
</tr>
<?
mysql_connect("localhost","root","") or die(mysql_error());
mysql_select_db("test") or die(mysql_error());
$query = mysql_query("select * from pricetest");
if(!$query)
{ die(mysql_error());}
else
{
while($row = mysql_fetch_array($query))
{
echo "<tr> ";
?>
<td>
<select name="size" id="size">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
<td> <? $row['pd_name']; ?> </td>
<td> <? $row['price'];
}
}?>
</td>
</tr>
</table>
</div>
我可能做错了什么?
答案 0 :(得分:0)
您可以使用var x = $('#size').val();
代替var x = $('#size').attr('value');
同时在ajax中以data: 'size =' + x
发送数据。
答案 1 :(得分:0)
$(document).ready(function () {
$('#size').change(function () {
//alert("aaa");
var x = $('#size').attr('value'); alert(x);
//alert(x);
$.ajax({
type: "POST",
url: 'getsize.php',
data: 'size='+x,
success: function (data) {
alert(data);
}
})
});
});
答案 2 :(得分:0)
这是因为您的所有元素都具有相同的ID(size
)。
更改您的PHP代码:
$i = 1;
while($row = mysql_fetch_array($query))
{
echo "<tr id='row".$i."'> ";
?>
<td>
<select name="size" class="size_dd" id="<?php echo $i ?>" >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
<td class="pd_name" > <? $row['pd_name']; ?> </td>
<td class="price" > <? $row['price']; ?> </td>
<?php $i++ ?>
}
并将JS更改为:
<script type="text/javascript">
$(document).ready(function () {
$('.size_dd').change(function () {
//alert("aaa");
var size = this.value,
id = this.value;
//alert(x);
$.ajax({
type: "POST",
url: 'sizeChange.php',
data: 'size =' + size,
success: function (data) {
$('tr#row td.pd_name').html(data['pd_name']);
$('tr#row td.price').html(data['price']);
}
})
});
});
</script>