如何通过php-mysql查询获得javascript中的数据

how to get data in javascript passed through php mysql query

本文关键字:javascript 数据 何通过 php-mysql 查询      更新时间:2023-09-26

我想在选择框中显示700个产品数据,每次选择时我都必须打印一个描述表。之前我进行ajax调用并显示数据,但过程很慢。因此,我必须将所有数据发送到客户端,然后使用javascript更改选项更改的描述表。下面是我的代码

   <?php
     $data = json_encode( get_data_from_db() );
    ?>
<input type='hidden' name='data' id='data' value= " <?php echo $data; ?>" />

当我在jquery 中进行警报时

 alert( $("#data").val() );

我只看到

{[

警报中的值,但当我在浏览器上打印数据时,它确实以json格式打印

我如何在javascript中获取这些数据,然后我必须使用循环来提取针对特定id的数据,并从中提取ul li,然后嵌入它。请建议正确的方法以及警报的错误之处。感谢

另一个解决方案-不创建全局变量,而是将该数据设置为某个相关元素的data-属性。不要忘记对整个数组/对象执行json_encode(),然后对结果字符串执行htmlspecialchars()(正如其他人所指出的,缺少htmlspecialchars()是在提醒输入字段值时只得到"{["的原因)。不要忘记在调用htmlspecialchars()时指定ENT_QUOTES,否则如果任何值包含撇号字符,则可能会得到无效结果。

<?php
    $users = array(
        array('name' => 'Average', 'surname' => 'Joe'),
        array('name' => 'Average', 'surname' => 'Jane'),
        array('name' => 'Joe', 'surname' => 'Sixpack'),
        array('name' => 'John', 'surname' => 'Doe'),
        array('name' => 'Hong', 'surname' => 'Gildong'),
        array('name' => 'Foo', 'surname' => 'Bar'),
    );
?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
    <title>sandbox</title>
    <meta http-equiv='content-type' content='text/html; charset=UTF-8'/>
    <script type='text/javascript' src='js/jquery-1.6.1.min.js'></script>
</head>
<body data-users='<?php echo htmlspecialchars(json_encode($users), ENT_QUOTES); ?>'>
    <script type='text/javascript'>
        $(function() {
            var users = $(document.body).data('users');
            for ( var n in users ) {
                $('<div/>').text(users[n].name + ' ' + users[n].surname).appendTo(document.body);
            }
        });
    </script>
</body>
</html>

这使得6个<div/>元素以所有的名称和姓氏作为其内容。

您遇到的问题是在value属性周围使用双引号,但JSON输出中的所有键和字符串当然都用双引号,第一个双引号终止了HTML中的value属性。

不要将$data输出为隐藏元素的值。相反,将其输出到JavaScript变量:

<script>
var products_data = <?php echo $data; ?>;
</script>

然后您可以直接在JavaScript中使用products_data。(如图所示,它是一个全局变量,这并不理想;如果你可以将它包含在一个范围函数中,那会更好,但这取决于你的脚本等的组织方式。)

这是因为JSON是JavaScript对象文字格式的子集,所以有效的JSON也是内联定义对象的有效JavaScript。你的PHP会生成这样的东西并将其发送到浏览器:

<script>
var products_data = {
    "products": [
        {"id": 427, "name": "WonderWidget", "price": 27.99},
        {"id": 429, "name": "CoolNiftyThing", "price": 19.99}
    ]
};
</script>

显然,确切的结构将取决于您的服务器端$data对象。

原因是json编码的数组是这样格式化的:{[ "value1","value2",...]},因此,当您echo"value"字段内的字符串时,json中的第一个双引号字符串关闭隐藏输入的值属性

为了解决这个问题,你可以做一些类似的事情

<script>
var myData = <?php echo json_encode( get_data_from_db() ); ?> 
</script>

@T.J.Crowder对钱有正确的答案。

您在发布的示例中看到奇怪行为的原因可能是您的json_encode早期有双引号,并且在没有转义符

的情况下注入标记属性时会破坏dom

最好的方法是不要将JSON结构直接回显到脚本中(这可能会使您面临htmlspecialchars可能无法保护您的XSS问题)。

我建议您执行以下操作:

<script type="text/plain" id="json_data">
    <?php echo html_special_chars(json_encode($data)); ?>
</script>
<script>
    var myData = $.parseJSON($("#json_data").text());
</script>

JSON是而不是Javascript,不应被视为这样。

notval()使用text()

alert($("#data").text());