0

我目前正在使用我的 jQuery，下面是通过 PHP 生成列表的代码，然后可以单击该列表以创建该文件夹的子内容列表。

我有这个工作的jsfiddle：here

但是，当在我的页面上运行时，它没有运行；选择“No wrap - in”时，这个问题似乎被复制了。

老实说，我对这 4 个 jsfiddle 选项一无所知，它适用于 3 而不是 4。这可能是我的愚蠢疏忽，或者我可能遗漏了某种形式的关键信息

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<?php
if ($handle = opendir('fileServer')) {
    while (false !== ($file = readdir($handle)))
    {
        if (($file != ".") 
         && ($file != ".."))
        {
            $thelist .= '<LI id='.$file.'>'.$file.'';
        }
    }

    closedir($handle);
}
?>


<script type="text/javascript">
function genCont(){
//  alert(sel + "folder selected")


//This is the alert that works in JSfiddle but not on my Rpi :(
$("#fList li").click(function() {
    alert(this.id); // get id of clicked li used in below PHP
});

//future unused code, suggestion for improvement are, of course, welcome 
//var fName = sel;
<?php
if ($handle = opendir(/*not used yet*/)) {
    while (false !== ($file = readdir($handle)))
    {
        if (($file != ".") 
         && ($file != ".."))
        {
            $thelist2 .= '<LI><a href="'.$file.'">'.$file.'</a>';
        }
        }

    closedir($handle);
}?>
}
</script>


<div class="fsFolder">
<ul id="fList">
<?=$thelist?>   
</ul>
</div>

提前谢谢你

克里斯

4

2 回答 2

1

你需要用 doc.ready 包装你的代码

$(document).ready(function(){/*code*/});

更新

$(document).ready(function () {

    $("#fList li").click(function () {
        alert(this.id); // get id of clicked li
    });

    //$boobies = document.getElementByID("#fList li").this.id
    $boobies = $('#fList li')[0].id;

});
于 2013-09-02T20:35:11.123 回答
0

jsFiddle真正令人惊讶的默认行为让您大吃一惊，即将您的所有 JavaScript 代码包装在一个window load处理程序中。如果您查看 jsFiddle UI 的左上角，您将看到一个未标记的下拉框，其中包含onload选定的值。该window load事件发生在页面加载周期的后期，在所有 HTML 都被解析、所有外部资源（包括图像）都被加载等之后。

只需将您的script标签放在页面的末尾，就在 上方</body>，以便它们作用的元素存在。您的代码的问题在于这一行：

$("#fList li").click(...);

发生在该元素存在之前，因为它在页面源中位于它之上。只需将其放在页面源中的下方即可。

参考：

于 2013-09-02T20:37:13.717 回答