jqueryUI Slider：设置数据库范围内的最小值和最大值

Question

我的网站上有一个处理价格范围的jQueryUI滑块。

我在mysql中有一个产品表，其中包含各种条目。

我正在使用滑块过滤结果，但是我需要根据数据库中的记录设置最低和最高价格。

我应该只在html中生成包含最小值和最大值的php隐藏字段（使用php），然后使用jQuery来获取它们吗？ 还是有更好的方法来实现这一目标，例如使用AJAX？

谢谢

Answer 1

如果您在乎可访问性，最安全的方法是提供form元素，然后使用Javascript将其隐藏，以便没有javascript的用户仍然可以使用您的网站。 然后，您可以添加AJAX更新功能。

如果页面是动态的，则应使用表格。

Answer 2

您描述的任何一种方式都可以完成工作，我可能会选择隐藏的领域。

另一个选择可能是让您的php直接将值放入您的javascript文件中。

您只需要更改php文件中的标头即可使输出被浏览器读取为javascript。

这样就可以了。

Header("content-type: application/x-javascript");

您可以通过php在javascript中设置值（与其他任何php文件一样）。

就像将其他任何javascript文件和作业一样，将其包括在您的页面上，它简单而动态。 :)

Answer 3

使用php脚本获取结果并将其输出为JSON，如下所示：

<?php

$sql = 'SELECT MAX(price) as max, MIN(price) as min FROM products';

// .. do query, get row ...

echo(json_encode(array(
    "max"=>$max,
    "min"=>$min
)));

?>

然后使用$ .getJSON或$ .ajax（jQuery）获取结果，并在滑块中使用它们，如下所示：

<script type="text/javascript">
$(document).ready(function() {
    var max, min;
    $.ajax({
        url: "script.php",
        dataType: "json",
        async: false,
        success: function(data) {
            data = data[0];
            max = data.max;
            min = data.min;
        }
    });

    $.slider({
        max: max,
        min: min
    });
});
</script>

这是很快写的并且未经测试的，但是我希望您能全面理解；）