为什么ajax不会填充我的ul列表?

时间:2016-02-01 05:57:37

标签: javascript php ajax

所有需要的是,ul列表填充了来自页面加载的php代码中的数据。提前谢谢,对不起,如果我不准确,我是新来的。这篇文章主要是代码。

以下是ajax功能的代码:

$(document).ready(function() {
            var podtip="proba";
            $.ajax({
                url: 'php/dodajTVpocetna.php',
                type: 'POST',
                cache:false,
                data: { target: podtip },
                success: function (data) {

                        $('#slider ul').append(data);
                    }

            }); 

        }); 

这是php文件的代码:

$q = $_POST['target'];
    $conn=mysqli_connect("localhost","root","","iptv");
                        if (mysqli_errno($conn)) {
                            die("Neuspjela konekcija: " . mysqli_connect_error());

                    }
                else{
                    $upitM='SELECT * FROM stream WHERE Kategorija="Music" ORDER BY rand() LIMIT 0,1';
                    $music=mysqli_query($conn,$upitM);

                    $upitF='SELECT * FROM stream WHERE Kategorija="Movies" ORDER BY rand() LIMIT 0,1';
                    $film=mysqli_query($conn,$upitF);

                    $upitS='SELECT * FROM stream WHERE Kategorija="Series" ORDER BY rand() LIMIT 0,1';
                    $series=mysqli_query($conn,$upitS);

                    $upitN='SELECT * FROM stream WHERE Kategorija="News" ORDER BY rand() LIMIT 0,1';
                    $news=mysqli_query($conn,$upitN);

                    $upitMO='SELECT * FROM stream WHERE Kategorija="More" ORDER BY rand() LIMIT 0,1';
                    $more=mysqli_query($conn,$upitMO);


                    if(!$music)echo'greska je "'.mysqli_error($conn).'"';

                    while(($row = mysqli_fetch_assoc($music)) != NULL) {
                            $row1 = mysqli_fetch_assoc($news);
                            $row2 = mysqli_fetch_assoc($film);
                            $row3 = mysqli_fetch_assoc($series);
                            $row4 = mysqli_fetch_assoc($more);
                            print_r(error_get_last());
                            echo"<li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row['Link']."\");'>".$row['Naziv']."</a></div></li>
                                <li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row1['Link']."\");'>".$row1['Naziv']."</a></div></li>
                                <li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row2['Link']."\");'>".$row2['Naziv']."</a></div></li>
                                <li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row3['Link']."\");'>".$row3['Naziv']."</a></div></li>
                                <li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row4['Link']."\");'>".$row4['Naziv']."</a></div></li>";
                            }

            mysqli_close($conn);
                }

HTML列表:

<div class="w3-third">
  <div id="liquid1" class="liquid">
    <span class="previous"></span>
    <div class="wrapper">
        <ul id="slider">


        </ul>
    </div>
   <span class="next"></span>
</div>
</div>

之前我使用过ajax,它就是这样工作的。

3 个答案:

答案 0 :(得分:0)

您必须通过结果集行累积每次迭代的最终HTML内容。
更改您的while循环,如下所示:

$content = "";
while(($row = mysqli_fetch_assoc($music)) != NULL) {
                            $row1 = mysqli_fetch_assoc($news);
                            $row2 = mysqli_fetch_assoc($film);
                            $row3 = mysqli_fetch_assoc($series);
                            $row4 = mysqli_fetch_assoc($more);
                            //print_r(error_get_last());
                            $content .= "<li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".addcslashes($row['Link'],'"')."\");'>".addcslashes($row['Naziv'],'"')."</a></div></li>";
}
echo $content;

dataType选项添加到您的ajax请求对象中,以便HTML从服务器获取响应:

...
dataType : 'html',
...

另外,将响应数据附加为HTML,如下所示:

...
$('#slider ul').html(data);
...

答案 1 :(得分:0)

首先检查您的查询,返回值并正常使用:

print_r($film)和其他查询结果,看看最后会发生什么。

接下来你不需要使用

$('#slider ul').append(data);

使用它:

$('#slider').append(data);

答案 2 :(得分:0)

使用以下命令更改PHP代码:

$q = $_POST['target'];
    $conn=mysqli_connect("localhost","root","","iptv");
                        if (mysqli_errno($conn)) {
                            die("Neuspjela konekcija: " . mysqli_connect_error());

                    }
                else{
                    $upit='SELECT * FROM stream WHERE Kategorija in ("Music","Movies","Series","News","More") ORDER BY rand()';
                    $all=mysqli_query($conn,$upit);

                    if(!$all)echo'greska je "'.mysqli_error($conn).'"';
                    //uzimamo vrijednosti svih proizvoda za zadati podtip,smjestamo ih u div elemente i prikazujemo na pocetno
                    $ht = "";
                    while(($row = mysqli_fetch_assoc($all)) != NULL) {

                            print_r(error_get_last());
                            $ht .= "<li><div class=\"tv\"><a href='javascript:changeVideoJW(\"".$row['Link']."\");'>".$row['Naziv']."</a></div></li>";
                            }

            mysqli_close($conn);
            echo $ht;
                }

你的js代码:

$(document).ready(function() {
            var podtip="proba";
            $.ajax({
                url: 'php/dodajTVpocetna.php',
                type: 'POST',
                cache:false,
                data: { target: podtip },
                success: function (data) {

                        $('#slider').append(data);
                    }

            }); 

        });