Question

摘要：尝试引用多个深度调用中的“this”。

大家好，

我有一种情况，我有一组无序列表形式的按钮（按钮1 - 6）。单击其中一个按钮时，我希望getJSON加载更多＆lt; li＆gt;单击按钮下方的选项（基于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访问。

jQuery getJSON：从几个级别点击“this”

2 个答案: