Question

我有一个php函数，它返回给我一些RSS数据的数组，我想将PHP与javascript结合起来。所以，我做了以下步骤：

1-从PHP函数返回数组;

2-使用foreach循环返回的数组中的每个元素;

3-使用javascript创建<div>元素，并使用数组中的数据填充每个元素并添加动态效果。

这是我的代码：

      <script>
                <?php 
                header("Content-Type: text/javascript; charset=utf-8");
                foreach(getFeed() as $article){ 
                ?>
                    setInterval(function() {

                    createDiv();
                    },5000);


                    function createDiv() {
                    document.getElementById("test").appendChild(document.createElement("DIV"));

                        $("#test").append('<div ><h4 id="title"><?php echo $article["title"]; ?></h4><p id="content"><?php echo $article["description"];  ?></p>');
                    }

                <?php 
                }
                ?>
      </script>

      <div  id= "test">

      </div>

问题是我得到n个重复元素（n是数组的长度）：

元素1

元素1

元素1

...

然而，这不是我想要的，我想要返回数组中所有元素的理想结果：

元素1

元素2

元素3

...

那么，我该如何解决这个问题？

Answer 1

第一。请停止混合不同的语言:)这是丑陋和糟糕的风格。分开他们。如果它是一个文件使用隐藏的HTML标签来隐藏它们。

<?php
  echo '<input id="hiddenField" type="hidden" value="'.json.encode(getFeed()).'">';

?>

<script type="text/javascript">
   var myArrayAsString = $('#hiddenField').val();
   var myArray = JSON.parse(myArrayAsString);
   // [{artNo: 1}, {artNo: 2}, ...]
   // now you can do what ever you want with a result array in javascript
</script>

Answer 2

首先梳理脚本语言通常很令人头疼

我建议你宁愿进行一个php serer边调用，单独返回你的对象（最好是在json中）然后在你的javascript中调用该服务，这样你就可以很好地分离关注点。

同时查看代码，我看到你每次循环都会重新创建你的createDiv方法，所以你最终得到了该函数的多个实例，所以当你的setiInterval触发时它只是继续拾取你创建的第一个createDiv方法，因此继续解雇它，留下你的第一个div的多个实例。

编辑javascript代码

/// Transform it to HSV
cvtColor( src, hsv, CV_BGR2HSV );

/// Use only the Hue value
hue.create( hsv.size(), hsv.depth() );
int ch[] = { 0, 0 };
mixChannels( &hsv, 1, &hue, 1, ch, 1 );

Answer 3

检查一下。

<script>
        <?php 
            foreach(getFeed() as $article){ 
        ?>
            setInterval(function() {

                $("#test").append('<div class="post-id-<?php echo $article["id"] ?>"><h4 id="title"><?php echo $article["title"]; ?></h4><p id="content"><?php echo $article["description"]; ?></p>');

            }, 5000);

        <?php 
            }
        ?>
</script>
<div  id= "test">

</div>

如何使用javascript从php函数填充数组元素的<div>元素？

3 个答案: