Question

我的表：

     <?php
    $s=mysql_query("SELECT * FROM  bus_detail where source_point='$_SESSION[source_point]' && destination_point='$_SESSION[destination]'");
while($row=mysql_fetch_array($s))
{
?>
<ul id="products"> <li data-price="<?php echo $row['price'];?>">
<table>
<tr>
<td>Bus Operator</td>
<td>Bus No.</td> 
<td>Price</td>
     </tr>

 <tr>  
<td><?php echo $row['bus_name'];?></td>  
<td><?php echo $row['bus_no'];?></td> 
<td><?php echo $row['price'];?></td>
</tr>
 <?php }?>
</table>
</li></ul>

价格滑动条：

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script type="text/javascript">
function showProducts(minPrice, maxPrice) {
$("#products li").hide().filter(function() {
    var price = parseInt($(this).data("price"), 10);
    return price >= minPrice && price <= maxPrice;
}).show();
}

$(function() {
var options = {
    range: true,
    min: 0,
    max: 800,
    values: [50, 200],
    slide: function(event, ui) {
        var min = ui.values[0],
            max = ui.values[1];

        $("#amount").val("$" + min + " - $" + max);
        showProducts(min, max);
    }
}, min, max;

$("#slider-range").slider(options);

min = $("#slider-range").slider("values", 0);
max = $("#slider-range").slider("values", 1);

$("#amount").val("$" + min + " - $" + max);

showProducts(min, max);
});
</script>
</head>
<body>
<p>
<label for="amount">Price range:</label>
<input type="text" id="amount" style="border: 0; color:#41924B; font-weight: bold;" />
</p>
<div id="slider-range"></div>

我已经将我的价格滑动条包含在我的表格页面中..它显示了我的结果，但没有以正确的方式显示...我想根据范围中选择的价格显示结果。第一个范围是从400开始自动＆amp;根据表在while循环中，它显示了不同表的结果。我想根据范围在同一张表中显示它们。任何帮助??

Answer 1

将您的while代码放入您的表格中。它当前正在循环并创建多个表元素。

你也可以使用div而不是table。更容易风格/位置等。

Answer 2

改变

   id='products'

到

   class = 'products'

并在jquery中更改它。 while循环每次迭代生成一个ul和一个表。如果您确实希望这样做，请将ul和table放在while循环之外。

在javascript中的价格滑动条，以给出适当的结果

2 个答案: