尝试使用javascript / php动态添加和命名div到页面

时间:2017-05-28 14:06:02

标签: javascript php jquery html

我是php和javascript的新手。我想用php动态地将div添加到页面中。最后我想要的是能够调用添加div的php函数。我想多次为单个页面调用该函数 - 所以我想通过多个函数调用添加多个div。

这似乎并不困难,但是......我希望每个动态添加的div都具有相同的类名,但是由于各种原因,我希望id基于页面上已有该类的div数(例如,添加的第一个div可能有id = 0.第二个id = 1,第三个id = 2等。)

我看过stackoverflow但没有发现任何线索。我真的很感激任何帮助。

我尝试了以下方法,但它不起作用(这是一个非常简化的版本):

function getCount() {
    ?><script>
        $(document).ready(function(){

            var elems = $('body').find('.mydiv');

            $.ajax({
                type: 'POST',
                url: '',
                data: {count: elems.length},                
                cache: false,
                success: function(response) {  
                    console.log(response);
                }
            });
        });
    </script><?
}



echo '<!DOCTYPE html>
    <html>
        <head>
            <title>Test</title>
            <script src="../jquery-3.2.1.js"></script>
        </head>

        <body>';

        $count = -1;

        getCount();

        if (!empty($_POST)) {
            foreach($_POST as $key => $value) {
                if (!empty($key) && !empty($value)) {
                    echo 'key = '.$key.'  value = '.$value;
                    if ($key == 'count') {
                        $count = $value;
                    }
                }               
            }
        }           

        if ($count > -1)
            echo "<div class = 'mydiv' id = 'mydiv".$count."'></div>";

echo "</body></html>";  

1 个答案:

答案 0 :(得分:0)

你不想在这里混合使用js和php,你可以单独使用php实现这一点,这里是代码示例

<?php
echo 'your headers and layout tags go here';

function addDiv($count){
echo "<div class = 'mydiv' id = 'mydiv".$count."'>current div id is ".$count."</div>";
}
$count=0;
addDiv($count++);
addDiv($count++);
addDiv($count++);

?>