元素列表动态加载网页

Element list dynamically loading a webpage

本文关键字:网页 加载 动态 列表 元素      更新时间:2023-09-26

我有一个列表,我想做的是当用户单击列表项sport1时,它将显示他从数据库(表sport1)的结果当他点击列表项education1时,将显示表education1的结果。问题不在于如何从数据库检索数据,问题是留在同一页面,当用户点击一个项目,它需要的数据将被检索,我尝试使用数据过滤器,但它不起作用。谢谢你们的帮助。

<ul class="clearfix">
    <li><a name="sport1" href="#"  class="active">
      <h5>Sport</h5>
      </a></li>
    <li><a name="education1" class="" href="#" >
      <h5>Education</h5>
      </a></li>
    <li><a name="Loisir1" href="#" >
      <h5>Loisir et detente </h5>
      </a></li>
    <li><a name="Culturel1" href="#" >
      <h5>Culturel</h5>
      </a></li>
    <li><a name="Equipement1" href="#" >
      <h5>Equipement public</h5>
      </a></li>
    <li><a name="Regeneration1" href="#" >
      <h5>Regeneration urbaine</h5>
      </a></li>
     <li><a name="Residentiel1" href="#">
      <h5>Residentiel</h5>
      </a></li>
  </ul>

使用jquery创建如下内容:

<ul class="clearfix">
    <li>
        <a id="sport1" name="sport1" href="#"  class="active" onclick="showResults(this)"> <h5>Sport</h5></a>
    </li>
</ul>
<script>
function showResults(obj) {
    var item = $(obj).attr('id');
    $.get('/somewebservice/'+item, function(result) {
        //display results
        for(var i in result) {
            // render result
        }
    },'json');
});
</script>