html - 无法使用 jQuery 获取列表项 ID

Question

我需要将列表元素 ID 传递给 ajax，但这段代码似乎无法完成这项工作:

HTML:

    <ul  id="tree">
       <li><a id="1">Finance</a></li>
       <li><a id="2">ACC</a></li>
        <li><a href="<?php echo base_url()?>admincont/departament/6>">HR</a></li>
   </ul>

JavaScript:

<script type="text/javascript">
$( document ).ready(function() {
  $('#tree li').click(function(){
    $.ajax({
       method: "POST",
       data: {depID: $(this).attr('id')},// i have also tried  $(this).id
      url: "<?php echo base_url();?>/assets/getdepartment.php",
      success: function(msg){
        $('#result').html(msg);
      }
    })
  })
});
</script>

我的 php 文件:

<?php
$depID = $_POST['depID'];
echo $depID;
?>

在我的结果 div 中，我得到“注意: undefined index :第 2 行的 depID”

Answer 1

this 不是指你的 anchor ，它是指列表项。

虽然您可以使用 this 找到 anchor :

data: {depID: $(this).find('a').attr('id')}

或者(在我看来更可取)，只需将事件处理程序附加到 anchor 即可:

$('#tree li a').click(function(e){
    e.preventDefault(); // If you need to prevent the default behaviour
    $.ajax({
        method: "POST",
        data: {depID: $(this).attr('id')},
        url: "<?php echo base_url();?>/assets/getdepartment.php",
        success: function(msg){
            $('#result').html(msg);
       }
   })
})