Javascript jquerykeyup-多个输入和传递id名称？

我在表单中有许多输入id，如下所示（例如，不完整表单）。这是用于Chrome扩展的，因此我无法修改表单

<form>
  <input id="data-draft-brand-name" />
  <input id="data-draft-name-en-us" />
  <input id="data-draft-bullet-points-bullet1-en-us" />
  <input id="data-draft-bullet-points-bullet2-en-us" />
  <input id="data-draft-description-en-us" />
</form>

正如你所看到的，将会有很多重复。无论如何，我都可以将id数组传递给keyup，然后访问函数中的id。以一些伪代码为例

$(["#data-draft-brand-name","#data-draft-name-en-us"]).keyup(function(inputID) {
  $(inputID).css('border','1px solid red');
}

---

给你一个解决方案

$("#data-draft-brand-name, #data-draft-name-en-us").keyup(function() {
  var id = $(this).attr('id');
  $('#' + id).css('border','1px solid red');
});

无需提供方括号

[]

，

id

应以逗号分隔

这里是

jsfiddle

$（“#数据草稿品牌名称，#数据草稿名称en us”）.keyup（函数（）{
var currentVal=$（this.val（）；
currentVal=currentVal.toLowerCase（）；
console.log（currentVal）；
var currentLength=currentVal.length；
currentLength=2000—currentLength；
$（“#描述计数”）.text（`currentLength}个字符左`）；
如果（currentVal.indexOf（'word'）！=-1）{
$（“#美国数据草稿说明”）.css（'border'，'1px实心红色'）；
$（“#美国数据草案说明”）.css（'background'，'red'）；
}否则{
$（“#美国数据草稿说明”）.css（'border'，'1px solid#a6'）；
$（“#美国数据草案说明”）.css（'background'，'none'）；
}
});
给你一个解决方案

$("#data-draft-brand-name, #data-draft-name-en-us").keyup(function() {
  var id = $(this).attr('id');
  $('#' + id).css('border','1px solid red');
});

无需提供方括号
[]
，
id
应以逗号分隔

这里是
jsfiddle


$（“#数据草稿品牌名称，#数据草稿名称en us”）.keyup（函数（）{
var currentVal=$（this.val（）；
currentVal=currentVal.toLowerCase（）；
console.log（currentVal）；
var currentLength=currentVal.length；
currentLength=2000—currentLength；
$（“#描述计数”）.text（`currentLength}个字符左`）；
如果（currentVal.indexOf（'word'）！=-1）{
$（“#美国数据草稿说明”）.css（'border'，'1px实心红色'）；
$（“#美国数据草案说明”）.css（'background'，'red'）；
}否则{
$（“#美国数据草稿说明”）.css（'border'，'1px solid#a6'）；
$（“#美国数据草案说明”）.css（'background'，'none'）；
}
});
要实现您想要的功能，您应该使用
类来定义哪个
输入将具有
键控
事件处理程序

此外，您还可以通过调用
attr（“id”）
来检索当前
输入的id

因此，您将得到如下代码：


$（文档）.ready（函数（）{
$（“.keupinput”）.keyup（函数（事件）{
var inputid=$（this.attr（“id”）；
log（“我是”+inputid+“输入”）；
});
});
要实现您想要的功能，您应该使用
类来定义哪个
输入将具有
键控
事件处理程序

此外，您还可以通过调用
attr（“id”）
来检索当前
输入的id

因此，您将得到如下代码：


$（文档）.ready（函数（）{
$（“.keupinput”）.keyup（函数（事件）{
var inputid=$（this.attr（“id”）；
log（“我是”+inputid+“输入”）；
});
});
您可以对属性使用带选择器的start，[name^=“value”][
如果我们需要编辑您的代码，那么应该在下面

$( "div[id^='data-draft-'" ).keyup(function() {
var currentInput = $(this);
var currentVal = $(this).val();
    currentVal = currentVal.toLowerCase();
console.log(currentVal);
var currentLength = currentVal.length;
    currentLength = 2000 - currentLength;

$('#description-count').text(`${currentLength} characters left`);

if(currentVal.indexOf('word') !== -1) {
    currentInput.css('border','1px solid red');
    currentInput.css('background','red');
} else {
    currentInput.css('border','1px solid #a6a6a6');
    currentInput.css('background','none');
}
});

享受
您可以对属性使用带选择器的start，[name^=“value”][
如果我们需要编辑您的代码，那么应该在下面

$( "div[id^='data-draft-'" ).keyup(function() {
var currentInput = $(this);
var currentVal = $(this).val();
    currentVal = currentVal.toLowerCase();
console.log(currentVal);
var currentLength = currentVal.length;
    currentLength = 2000 - currentLength;

$('#description-count').text(`${currentLength} characters left`);

if(currentVal.indexOf('word') !== -1) {
    currentInput.css('border','1px solid red');
    currentInput.css('background','red');
} else {
    currentInput.css('border','1px solid #a6a6a6');
    currentInput.css('background','none');
}
});

享受
创建一个循环，检查哪些输入有值。然后获取那些有值的输入并从中获取ID。然后，通过函数运行这些ID？我将添加一个数据属性以将它们分组并绑定到该工作？
数据草稿输入
然后使用
$（“[数据草稿输入]”）。键控（函数（）{
井ID是单数的，所以…不确定它们如何重复。创建一个循环，检查哪些输入有值。然后获取那些有值的输入并从中获取ID。然后，通过函数运行这些ID？我会添加一个数据属性来对它们进行分组并绑定到该？
数据草稿输入
然后使用
$（“[数据草稿输入]”）.keyup（函数（）{
井ID是单数的，因此…不确定它们如何重复。这似乎根本不会触发任何事件。已尝试注销inputID，但nothing@K20GH我已经更新了答案。你的输入文本框是动态生成的吗？我没有投你反对票。我实际上只是提交了对你的第一个代码块的编辑，因为它不同我知道你没有无缘无故地否决别人的投票。我已经更新了答案。请看一看。不要使用
inputID.currentTarget.I
获取id，请使用
$（this.attr（'id'））
这似乎根本不会触发任何事件。已尝试注销inputID，但nothing@K20GH我已经更新了答案。你的输入文本框是动态生成的吗？我没有投你反对票。我实际上刚刚提交了对你的第一个代码块的编辑，因为它与第二个不同。它现在可以工作：）@K20GH我知道你没有无缘无故地否决别人的投票。我已经更新了答案。请看一看。不要使用
inputID.currentTarget.I
获取id，请使用
$（this.attr（'id'））作为一般的旁注，在一个组织良好的公司/团队中，不要将类用于功能性代码。CSS/Style人员会一时兴起删除/添加它们。对于代码中的功能性使用，只使用数据属性、标识符和类似的东西，而CSS/Style人员不会触及它们。此外，
这个.id
在一个良好的组织中也可以作为一般旁注anized company/team不在功能代码中使用类。CSS/Style人员会一时兴起删除/添加它们。在代码中使用功能时，只使用数据属性、标识符和类似的内容，因为CSS/Style人员不会接触这些内容。此外，
this.id