JS/JQuery:动态添加"pattern"和"title"属性以形成输入

Kev*_*ven 3 html javascript forms jquery html5

我有多个表单输入元素.我想为每一个添加pattern属性和title属性,但不是手动添加,我想使用JavaScript/jQuery 动态添加相同的内容patterntitle每个表单输入.

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

<input type="text" class="form-control" id="paycheck" />
<input type="text" class="form-control" id="investments" />
<input type="text" class="form-control" id="otherIncome" />
Run Code Online (Sandbox Code Playgroud)

作为最终结果,我希望每个表单输入看起来如下所示:

<input pattern="\d*\.?\d*" title="blah blah blah" type="text" class="form-control" id="paycheck" />
etc...
Run Code Online (Sandbox Code Playgroud)

作为示例,我为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...
Run Code Online (Sandbox Code Playgroud)

Kev*_*ven 6

最后,我发现语法是正确的.代码中的其他地方发生了一个错误,导致该语句无法运行.只是表明你应该始终确保代码中其他地方的一切都很好.

但是,我确实从中学到了一些我将为其他人注意的事项:

  1. jQuery .attr()函数将动态添加您指定的任何属性,因此您不需要先pattern=""输入表单元素,以便添加或更改值.
  2. 重要的是,如果要使用jQuery动态添加正则表达式,则需要使用ESCAPE某些字符.

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

  1. 最后,我没有必要使正则表达式所需的字段工作.如果我在字段中包含不正确的文本,HMTL5验证只会给我一个错误,当它抛出错误时,表单未提交.如果我将字段留空或在字段中放入正确的文本,则不会抛出任何错误.如果我错了,我可以解释一下.