Question

好吧，我正在开发一个网页来查看网格图库中的图像。图像被分类，并且有一个左窗格可以选择要查看的类别。此外，左窗格中的一个链接是“我的类别”，它将所有类别视为网格中的文件夹图像。我有一个jquery脚本，当点击其中一个类别时更改图库中的图像，当点击“我的类别”时，它会将图像更改为我拥有的所有类别的文件夹图像。直到现在一切正常。问题是，当我选择“我的类别”并且图库包含我所拥有的所有类别的文件夹图像时，现在我想使用相同的jquery脚本，以便当我单击其中一个“文件夹的图像”时参考其中一个类别，查看该类别中的图像，但它不起作用！

用于向左窗格添加类别的代码：

<ul class="nav nav-sidebar">
        <li class="active"><a href="#"><b>Your Folders</b><span class="sr-only">(current)</span></a></li>
      <?php
        $db = mysql_connect("localhost", "root","");
        $er = mysql_select_db("images", $db);

        $sql="SELECT * FROM folder";
        $result=mysql_query($sql);

        while($row=mysql_fetch_array($result))  
        {
            echo "<li><a class='folder' value='$row[folder_id]' title='$row[folder_name]' href='#'>&nbsp&nbsp&nbsp$row[folder_name]</a></li>";
        }
      ?>
      </ul>

html，它在图库中添加图片：

<div class="row" id="txtHint">

</div>

用于检测何时选择“我的类别”的JQuery脚本：

$(".folders").click(function() {
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                    alert(xmlhttp.responseText);
                }
            }
            xmlhttp.open("GET","getFolders.php?",true);
            xmlhttp.send();
        });

jquery访问的php代码：

<?php
$db = mysql_connect("localhost", "root","");
$er = mysql_select_db("images", $db);

$sql="SELECT * FROM folder";
$result=mysql_query($sql);

while($row=mysql_fetch_array($result))  
{
    echo "<div class='col-lg-3 col-sm-4 col-xs-6'><a title='$row[folder_name]' class='folder' value='$row[folder_id]' href='#'><img class='thumbnail img-responsive' src='folder.png'></a></div>";
}

＆GT？;

jquery，用于检测何时选择其中一个类别：

        $(document).ready(function() {
        $(".folder").click(function() {
            var $value = $(this).attr("value");  
            document.getElementById("title").innerHTML = $(this).attr("title");
            if ($value == "") {
                document.getElementById("txtHint").innerHTML = "";
                return;
            } else {
                if (window.XMLHttpRequest) {
                    // code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp = new XMLHttpRequest();
                } else {
                    // code for IE6, IE5
                    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                }
                xmlhttp.onreadystatechange = function() {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                    }
                }
            xmlhttp.open("GET","getImages.php?q="+$value,true);
            xmlhttp.send();
            }
        });

由jquery

访问的php

<?php

$q = intval($_GET["q"]);

$db = mysql_connect("localhost", "root","");
$er = mysql_select_db("images", $db);

$sql="SELECT image_url, image_name FROM image WHERE folder_id=$q";
$result=mysql_query($sql);

while($row=mysql_fetch_array($result))  
{
    echo "<div class='col-lg-3 col-sm-4 col-xs-6'><a title='$row[image_name]' href='#'><img class='thumbnail img-responsive' src='$row[image_url]'";
}

由jquery更新时的html代码存在一些问题

0 个答案: