在javascript中使用变量来动态引用html元素答案

【问题标题】：Using variables in javascript to reference html elements dynamically在javascript中使用变量来动态引用html元素
【发布时间】：2013-10-31 13:50:19
【问题描述】：

如果勾选了复选框，我正在尝试使用 jQuery / javascript 从命名的输入元素中删除一个类。

我有几个复选框，每个复选框都有一个隐藏的（页面加载时）文本输入字段。

复选框和文本输入字段分别命名为“question_X”和“question_X_description”。（例如，X 是 0 到 100 之间的数字）

因此，我试图在我的代码中定义一个变量，该变量被定义为“此元素的名称”+“_description”，然后使用它来定义合适的元素以从中删除类。

这是我尝试过的：

$('input:checkbox').change(function(){

var x = $(this).attr('name').'_description';

if($(this).is(":checked")) {
    $('input[name="x"]').removeClass("hidden");
} else {
     $('input[name="x"]').addClass("hidden");
}
});

但是，当任何复选框被选中时，什么都不会发生。我是否正确引用了我的变量？

【问题讨论】：

标签： javascript jquery variables

【解决方案1】：

使用您的控制台，它会显示错误消息。

第一期

var x = $(this).attr('name').'_description';
                           ^^^

这不是在 JavaScript 中构建字符串的方式。 JavaScript 不使用. 来连接字符串。它使用+

var x = $(this).attr('name') + '_description';

第二期

$('input[name="x"]').

你不是在寻找你构建的字符串，你在寻找一个名为 x 的元素

需要

$('input[name="' + x + '"]').

【讨论】：

感谢好心的维京人：我不擅长 javascript :) 感谢您教我如何正确引用我的变量并连接！一旦时间限制用完，我会接受。

【解决方案2】：

$('input[name="x"]').removeClass("hidden");

正在寻找：

<input name="x" />

试试

$(name="'+x+'").removeClass("hidden");

【讨论】：

【解决方案3】：

使用document.getElementById('element_name')

HTML 元素示例： <input type="text" id="element_name">

【讨论】：