我是使用$（this）还是.click使用不正确？

问题描述：

我正在尝试构建一个简单的常见问题解答页面，其中包含当他们的问题被点击时的slideDown和Up。当用户点击类“问题”时，我希望mytarget变成'＃'+ [该问题的ID] +'ans'，这样适当的答案就会下滑。

toggleSlide部分工作时，我只是给它一个答案的ID;我不确定我的.click函数是错误的，还是我使用$（this），或者两者兼而有之。

$(document).ready(function() { 
    var qid = ''; 
    var mytarget = ''; 

    function toggleSlide() { 
     if ($(mytarget).css('display') == 'none') { 
      $(mytarget).slideDown(600, 'swing'); 
     } 

     else if ($(mytarget).css('display') == 'block') { 
      $(mytarget).slideUp(600, 'swing'); 
     } 
    }; 

    $('.answer').hide(); 
    $('.question').click(function() { 
     qid = $('this').id(); 
     mytarget = '#' + qid + 'ans'; 
     toggleSlide(); 
    }); 
});

答

试试这个：

$(function() { // shorthand for $(document).ready()... 
    $('.answer').hide(); // preferably div.answer if they are all <div>s 
    $('.question').click(function() { 
     // no need to check what it currently is, use slideToggle 
     $('#' + this.id + 'ans').slideToggle(600, 'swing'); 
    }); 
});

谢谢！为什么div.answer比.answer更好？ – DsDyer 2012-04-24 19:53:05

我喜欢这一款。但div.answer实际上并不可取。 jsPerf可以显示没有元素的普通类将会更快。另外，我仍然喜欢使用$（document）.ready（），因为它对于阅读代码的任何人（我自己或其他人）来说都是非常明显的，它是文档就绪函数。但那部分是个人喜好。 – 2012-04-24 19:54:25

'$（this）.attr（'id'）'=>'this.id'。 – gdoron 2012-04-24 19:57:41

答

变化来自：

$('this').id();

要：

$(this).attr('id')

this是关键字在JavaScript中，而不是一个字符串。
在jQuery中没有id函数，你得到的编号为.attr('id')。
id是DOM元素的属性。所以你可以使用这个：this.id

$('.question').click(function() { 
    qid = this.id; 
    mytarget = '#' + qid + 'ans'; 
    toggleSlide(); 
});

谢谢。 this.id 也有效。 – DsDyer 2012-04-24 19:47:19

@ user1354606。阅读笔记。 – gdoron 2012-04-24 19:49:52

答

不要做：qid = $('this').id();

做：qid = $(this).attr('id');，而不单引号

什么是$（...）.id（）'？没有这样的'id'功能。 – gdoron 2012-04-24 19:45:05

@gdoron，你是对的。专注于这个vs'这个'。现在显示正确的解决方案。 – agarcian 2012-04-24 19:47:21

谢谢gdoron。我不知道我在哪里得到.id（）是一件事情的想法。我在没有互联网的汽车旅行中写了这个，在我的手机上做了研究，并且必须在没有阅读上下文的情况下拿起这个功能。 – DsDyer 2012-04-24 19:58:08

答

function toggleSlide(mytarget) { 
    if ($(mytarget).css('display')=='none'){ 
     $(mytarget).slideDown(600, 'swing');} 

    else if ($(mytarget).css('display')=='block'){ 
     $(mytarget).slideUp(600, 'swing');} 
});

当你调用你应该通过参数的功能时：

qid = $(this).id(); 
    mytarget= '#' + qid + 'ans'; 
    toggleSlide(mytarget);

我是使用$（this）还是.click使用不正确？

相关推荐