Question

我尝试在多个DOM上创建click事件。当点击每个元素时，它应该附加相应的htmls。因此，我尝试使用switch语句。

<a href="#" data-index= 0 class="skill_item">skill</a>
<a href="#" data-index= 1 class="skill_item">skill</a>

我添加了数据索引来区分DOM。

  $('#skill_item').click(function(event){

switch ($('this').attr('data-index')) {

  case 0:
    $('.skill_desc').html('<p>111</p>').css({'display':'block', 'text-align':'center', 'color':'white'});
    break;

  default:

}
event.preventDefault();

}）;

上面的代码我尝试渲染不同的DOM。

任何人都可以帮我解释为什么这段代码不起作用？并且很高兴知道我的方法是否会起作用..！

Answer 1

第一个错误是您将skill_item类分配给您的主播，而在您的jQuery代码中，您定位的ID为skill_item的锚标记，而$('#skill_item')使用{ {1}}

第二个错误是$('.skill_item')应该是$('this').attr('data-index');

第三个错误是$(this).attr('data-index');将值返回为String。因此要么将其转换为INT，要么通过将case值放入引号来检查String值。

完整的工作代码。

$(this).attr('data-index');

将值缓存到变量中始终是一种很好的做法。例如$('.skill_item').click(function(event){ var index = $(this).attr('data-index'); switch (index) { case '0': $('.skill_desc').html('<p>111</p>').css({'display':'block', 'text-align':'center', 'color':'white'}); break; default: } event.preventDefault(); });

我的javascript开关语句无效吗？

1 个答案: