1

我花了很多时间在网上寻找帮助，但我还没有找到任何可以满足我的需求的东西，并且试图从多个来源拼凑解决方案，但基本上已经陷入了死胡同。

我要做的是创建一个网页，在页面的一部分上列出音乐家，这样我就可以点击单个音乐家的名字，并在另一部分加载他们的专辑、歌曲、歌词等列表同一页的。数据都在 MySQL 数据库中，数据库中的每个项目都有一个唯一的 ID。

我可以将数据从数据库中取出并放入一个数组中，如果我手动设置 ID，我可以在页面的单独部分创建音乐家列表以及他们的信息列表。如果我可以点击返回 ID，然后我可以专注于尝试使用 Ajax 加载所需的数据，我猜 JQuery 会在页面上我想要的位置显示它，但我一直坚持可点击的列表工作。

我正在使用 Joomla 3.1 创建网站，但代码只是 PHP 和 Javascript。

我最近的努力如下：

<ul id="nav" style="list-style:none">

<?php
    foreach ( $this->items as $item ) {
       echo '<li id='.$item->itemid.' onclick="$(this).index()" >'.$item->title.'</li>';
    }   
?> 
"</ul>" 

<script>
    linkClicked = function (index) {
       alert($('#nav li').get(index).id);
    }

像我所有其他努力一样，这创建了一个不错的列表，但是当我单击任何列出的项目时什么都没有发生，而且我显然偏离了轨道。我原本打算这会显示一个警报，显示所选项目的 id，但不会出现警报。我有一种感觉，解决方案非常简单，但我只是没有得到它，任何帮助都会非常感激。

对于不熟悉 Joomla 的人，它提供了将 MySQL 数据加载到数组中的功能，使用数据库中相关列的名称访问各个项目。所以 $item->title 给出了当前数据行的 'title' 字段的值。

4

1 回答 1

0

您需要在文档准备好时触发您的代码。你的代码没有被触发。您需要将点击事件绑定到文档准备好的 li 标签，如下所示：

//on document ready
$(function(){
  //select the li tags from #nav and bind a click event to them
  $('#nav li').on('click', function(){
    //When li is clicked: alert the attribute "id" from the clicked element (this = li element)
    alert($(this).attr('id'))
  })
});

使用委托：也适用于动态添加到 dom 的元素（在页面加载后，例如通过 ajax 调用）

$(function(){
  $('#nav').on('click', 'li', function(){
    alert($(this).attr('id'))
  })
});
于 2013-10-18T00:21:20.670 回答