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

最简单的方法是在您想要保留 this 的级别执行

var that = this;

- 然后稍后将其作为 that 访问。