jquery - 无法使数据属性与 jquery 一起使用

Question

我有三个按钮。当我按下按钮一时，行x应该切换，按钮二，行y切换等等......(使用html5的数据属性)。不幸的是，我无法实现这一点，因为我收到一条错误消息 type error: star.toggle() is not a function 。我的代码如下:

<button class= "a" data-p="x"> Button one </button> 
<button class= "a" data-p="y"> Button two </button>
<button class= "a" data-p="z"> Button three </button>


<div class = "x"> Line x </div>
<div class = "y"> Line y </div>
<div class = "z"> Line z </div>

jquery:

$(document).ready(function() {
    $('.a').on('click', function(){
         var star= $(this).attr('data-p');
         (star).toggle();
    }); 
});

Answer 1

这就是你想做的事？

请参阅 JSFiddle:http://jsfiddle.net/nb6ypjsq/

$(document).ready(function() {
    $('.a').on('click', function(){
         var star= $(this).data('p');
         $('.' + star).toggle();
    }); 
});