JQuery的 - 通过数据属性=变量

使用（自定义）的JQuery data-attributes检索，其中显示这些图标的元素，我成功地改变图标，这方面的工作代码中查找元素（S）：JQuery的 - 通过数据属性=变量

<i class="glyphicon glyphicon-check" data-year="2014" data-flag_check="1"></i> 
... 
<script> 
    ... 
    $('i[data-year="2014"]').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

但是，如果我尝试用变量替换常量2014，我的代码停止工作。

var yearIn = "2014"; 
$('i[data-year=yearIn]').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

问：是否有可能用一个变量执行此操作？

可能后续问题：如果是这样，任何人都可以检测到我的语法有什么问题吗？

来源

2017-07-29 tony gil

你只是缺少字符串连接：

var yearIn = "2014"; 
$('i[data-year=' + yearIn + ']').removeClass('glyphicon-check').addClass('glyphicon-unchecked'); 
// ------------^^^^^^^^^^^^^^

或者在ES2015 +，你可以使用文字用替代令牌的模板：

var yearIn = "2014"; 
    $(`i[data-year=${yearIn}]`).removeClass('glyphicon-check').addClass('glyphicon-unchecked'); 
// ^------------^^^^^^^^^-^

FWIW，我总是围绕使用引号当它来自一个变量时，选择器中的值，以防变量以空格结束，例如：

var yearIn = "2014"; 
$('i[data-year="' + yearIn + '"]').removeClass('glyphicon-check').addClass('glyphicon-unchecked'); 
// ------------^--------------^

或

var yearIn = "2014"; 
$(`i[data-year="${yearIn}"]`).removeClass('glyphicon-check').addClass('glyphicon-unchecked'); 
// ------------^---------^

来源

2017-07-29 12:31:31

或者使用模板文字:) – Vucko

@Vucko：相当。我真的应该开始混合那些，在两年后... –

这样一个noobie slipup，我无话可说，在我自己的青睐。 UPVOTED和CHOSEN！：） –

您使用字符串字面'yearIn'而不是变量yearIn，做这样的事情来连接字符串：

$('i[data-year=' + yearIn + ']').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

来源

2017-07-29 12:31:43 Dij

我对这样一个noobie错误感到愧疚和尴尬。 UPVOTED –

JQuery的 - 通过数据属性=变量

回答

相关问题