jQuery getJSON：从几个级别向下点击'this'

Question

总结:试图从几个呼叫中引用点击"this"。

大家好，

我有一个情况，我有一个无序列表形式的一组按钮(按钮1 - 6)。当其中一个按钮被点击时，我想让它getJSON加载更多选项(基于json数据)在被点击的按钮下面。现在，当我单击其中一个按钮时，它会在所有按钮下加载基于json的选项。问题是，我不确定如何引用"click"函数调用的"this"，而不是与嵌套调用之一相关的"this"。

当涉及到jQuery时，我是一个大信徒，所以我意识到这可能是一个容易的修复。请原谅我的用词有点不准确。

感谢您阅读并考虑我的问题。

下面是相关的javascript:

$(".block-buttons .level1 a.level1_a").click(function () 
{
  $.getJSON('api/1/test.json', 
    function(data) {    
        ul = $('<ul>');
        $.each(data.items,
        function( intIndex, objValue )
        {
            a = $("<a/>").text(objValue.name);
            li = $('<li>').attr("class",'level2').append(a);
            ul.append(li);
        });
        /* Here is where the problem lies.  I'd like to append the 
           new JSON-loaded data to the ".level1" element that was clicked
           and not to all of the ".level1" elements.  I need to figure out how 
           to replace the ".level1" below with some reference to the "this"
           from the clicked element.  
        */
        $(".level1").append(ul);            
      });   
  }
  return false; 
});

下面是相关的HTML:

<div class="block-center block-buttons">
<ul>
<li class="top"><a class="top_a" href="">Make a Selection</a>
    <ul>
    <li class="level1"><a class="level1_a" id="button_1" href="">Button 1</a></li>
    <li class="level1"><a class="level1_a" id="button_2" href="">Button 2</a></li>
    <li class="level1"><a class="level1_a" id="button_3" href="">Button 3</a></li>
    <li class="level1"><a class="level1_a" id="button_4" href="">Button 4</a></li>
    <li class="level1"><a class="level1_a" id="button_5" href="">Button 5</a></li>
    <li class="level1"><a class="level1_a" id="button_6" href="">Button 6</a></li>
    </ul>
</li>
</ul>
</div>

Answer 1

将列表项赋值给一个变量，例如

$(".block-buttons .level1 a.level1_a").click(function () 
{
    var listItem = $(this).parent('li');
    $.getJSON('api/1/test.json', //etc

Answer 2

最简单的方法是

var that = this;

在您想要保留this的级别上，然后作为that访问它。