javascript - JS/JQuery : Dynamically add "pattern" and "title" attribute to form input

Question

我有多个表单输入元素。我想为每个添加一个 pattern 属性和一个 title 属性，但我不想手动添加，而是想动态添加相同的 pattern 和 title 到每个使用 JavaScript/jQuery 输入的表单。

这是表单输入字段现在的样子:

<input type="text" class="form-control" id="paycheck" />
<input type="text" class="form-control" id="investments" />
<input type="text" class="form-control" id="otherIncome" />

作为最终结果，我希望每个表单输入看起来像下面这样:

<input pattern="\d*\.?\d*" title="blah blah blah" type="text" class="form-control" id="paycheck" />
etc...

作为例子，我已经为 pattern 属性尝试了以下方法，但它们都不起作用:

$( "input" ).attr("pattern", '\d*\.?\d*');
$( "input" ).attr("pattern",  \d*\.?\d* );
$( ".formClass input" ).attr("pattern", '\d*\.?\d*');

$( "input" ).prop("pattern", '\d*\.?\d*');
$( "input" ).prop("pattern",  \d*\.?\d* );
$( ".formClass input" ).prop("pattern", '\d*\.?\d*');

...imagine something similar for the title attribute...

Answer 1

最后，我发现语法是正确的。代码中其他地方存在错误，导致该语句无法运行。只是表明您应该始终首先确保代码中其他地方的一切都很好。

不过，我确实从中学到了一些东西，我会为其他人指出:

1. jQuery .attr() 函数将动态添加您指定的任何属性，因此您无需先将 pattern="" 放入表单元素中添加或更改值的顺序。
2. 重要的一点是，如果您要使用 jQuery 动态添加正则表达式，则需要对某些字符进行转义。

正则表达式最初是 \d*\.?\d* 但在 DOM 中它显示为 d*.?d* 所以在发送正则表达式时通过 jQuery，我像这样转义了反斜杠:\\d*\\.?\\d*.

1. 最后，我不必让正则表达式工作需要我的字段。如果我在字段中包含不正确的文本，HMTL5 验证只会为我抛出一个错误，并且当它抛出错误时，表单没有提交。如果我将字段留空或在字段中输入正确的文本，则不会抛出任何错误。如果我错了，我会得到解释。