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

Using variables in javascript to reference html elements dynamically

本文关键字：动态 引用 html 元素 变量 javascript      更新时间：2023-09-26

如果勾选复选框，我正在尝试使用 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");
}
});

但是，选中 any 复选框时不会发生任何反应。我是否正确引用了我的变量？

使用您的控制台，它将有错误消息。

第一期 

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

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

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

第二期

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

不是在寻找您构建的字符串，而是在查找名为 x 的元素

需要

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

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

将寻找：

<input name="x" />

尝试

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

使用 document.getElementById('element_name')

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

相关文章：