关键字`this`在ajax函数中使用的问题

时间:2011-04-07 17:08:49

标签: php jquery ajax

好吧这是我在这里的一些疯狂的jquery代码。它正在做什么是去一个php文件来获得某种结果,然后向下滑动结果,但如果结果已经在那里只是向下滑动

$('#compatibility h2').click(function(){
        var clicked = $(this);
        if($(this).hasClass('collapsed'))
        {
            $(clicked).removeClass('collapsed');
            if($($(this)[0].nextSibling).is('ul'))
            {
                $(this).next().slideToggle();
            }
            else
            {
            $.get("getproducts.php", {cid: $(this).attr('id'), did: $("#deviceId").val()},
                  function(data)
                  {   
                    $(clicked).after(data).next().slideToggle(); //adds a <ul> <li> </li> </ul>  
                  });
            }
        }
        else
        {

            $(this).addClass('collapsed');  
            $(this).next().slideToggle();
        }
        //$(this).css('margin','4px 0 7px');
});

现在我的问题有点模糊,但我想知道为什么当我用关键字this替换click时,代码不会在点击的h2之后插入数据。另外,我想知道我是否以最好的方式使用jquery。

4 个答案:

答案 0 :(得分:5)

你为什么要这样做? var clicked = '#'+$(this).attr('id');

这应该有效:

var clicked = $(this);

答案 1 :(得分:2)

乍一看,我认为除了$ .get(...)之外,使用“this”会到处都是。我有时用来绕过回调和“this”的多个版本的一个技巧是在我的类或函数的顶部添加以下代码:

var me = this;

然后我只使用$(me)代替$(this)

答案 2 :(得分:1)

问题在第10行左右,他说:

$(clicked).after(data).next().slideToggle(); //adds a <ul> <li> </li> </ul>  

如果您将clicked替换为this,它将停止工作:this将指向来自$.get而非任何DOM元素的响应。

答案 3 :(得分:0)

第2行和第3行看起来非常错误,如果您正在做的是我认为您正在做的事情那么您正在做的是构建一个字符串'#'+ id_of_clicked_element,然后尝试运行jQuery操作在上面。这永远不会奏效!而且这也是不必要的。

只需if ($(this).hasClass ('collapsed'))即可。