teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

2

RegExp.prototype.sourceを使う方法を追記しました

2018/03/18 00:27

投稿

退会済みユーザー
answer CHANGED
@@ -1,12 +1,17 @@
1
1
  この問題を解決するには、バックスラッシュを2重にします。
2
2
 
3
3
  ```javascript
4
- $(function(){
5
- $('.required').prop('required', true);
6
- $('.phone').attr('pattern', '\d{2,4}-\d{3,4}-\d{3,4}');
4
+ $('.phone').attr('pattern', '\d{2,4}-\d{3,4}-\d{3,4}');
7
- })
8
5
  ```
9
6
 
10
- 文字列の中では、バックスラッシュがエスケープシーケンス(**It's** とかを文字列にするときに使うやつ:`'It\'s'`)の始まりになってしまうので、`\d{2,4}-\d{3,4}-\d{3,4}` は `d{2,4}-d{3,4}-d{3,4}` の文字列になります。そのため、修正前の HTML では `d{2,4}-d{3,4}-d{3,4}` を input に入力すると、OK になはずです。
7
+ 文字列リテラルの中では、バックスラッシュがエスケープシーケンス(**It's** とかを文字列にするときに使うやつ:`'It\'s'`)の始まりになってしまうので、`\d{2,4}-\d{3,4}-\d{3,4}` は `d{2,4}-d{3,4}-d{3,4}` の文字列になります。そのため、修正前の HTML では `d{2,4}-d{3,4}-d{3,4}` を input に入力すると、OK になってしますはずです。
11
8
 
12
- 文字列の中でバックスラッシュをバックスラッシュとして出すには、`\` と書きます。
9
+ 文字列リテラルの中でバックスラッシュをバックスラッシュとして出したいときは、`\` と書きます。
10
+
11
+ あるいは、正規表現を文字列にする .source を使って以下のように書くのもよいでしょう。
12
+
13
+ ```javascript
14
+ $('.phone').attr('pattern', /\d{2,4}-\d{3,4}-\d{3,4}/.source);
15
+ ```
16
+
17
+ 正規表現を正規表現として書けるので、お使いのエディタによっては、こちらの方が便利かもしれません。

1

エスケープシーケンスの説明を追加しました

2018/03/18 00:27

投稿

退会済みユーザー
answer CHANGED
@@ -7,6 +7,6 @@
7
7
  })
8
8
  ```
9
9
 
10
- 文字列の中では、バックスラッシュがエスケープシーケンスの始まりになってしまうので、`\d{2,4}-\d{3,4}-\d{3,4}` は `d{2,4}-d{3,4}-d{3,4}` の文字列になります。そのため、修正前の HTML では `d{2,4}-d{3,4}-d{3,4}` を input に入力すると、OK になるはずです。
10
+ 文字列の中では、バックスラッシュがエスケープシーケンス(**It's** とかを文字列にするときに使うやつ:`'It\'s'`)の始まりになってしまうので、`\d{2,4}-\d{3,4}-\d{3,4}` は `d{2,4}-d{3,4}-d{3,4}` の文字列になります。そのため、修正前の HTML では `d{2,4}-d{3,4}-d{3,4}` を input に入力すると、OK になるはずです。
11
11
 
12
12
  文字列の中でバックスラッシュをバックスラッシュとして出すには、`\` と書きます。