Mengapakah Regex Atribut Corak HTML saya Melemparkan Ralat \'Watak Tidak Sah dalam Kelas Aksara\'?

Masalah Atribut Corak: Menyelesaikan Kesahan dengan Ungkapan Biasa dalam HTML

Apabila menggunakan atribut corak dalam HTML, anda mungkin menghadapi ralat semasa menentukan corak regex yang berfungsi dengan bendera 'u' tetapi bukan bendera 'v'. Artikel ini menyelidiki isu ini dan menyediakan penyelesaian.

Masalahnya

Semasa bekerja dengan atribut corak dalam HTML, anda mungkin menghadapi amaran konsol berikut:

Pattern attribute value ^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9]+\.[a-zA-Z0-9]+$ is valid with the RegExp u flag, but not with the v flag:
Uncaught SyntaxError: Invalid regular expression: /^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9]+\.[a-zA-Z0-9]+$/v: Invalid character in character class.

Penjelasan

Bendera 'v', yang diperkenalkan dalam ECMAScript 2018, digunakan secara automatik apabila menyusun objek RegExp untuk digunakan dalam atribut corak elemen HTML. Ini bermakna corak yang disediakan ditukar kepada ungkapan biasa dengan bendera 'v' didayakan.

Bendera 'v' menguatkuasakan sekatan tambahan terhadap peraturan melarikan diri. Tidak seperti bendera 'u', bendera 'v' tidak membenarkan '-' literal tidak dilepaskan pada penghujung kelas aksara. Ini kerana bendera 'v' menyokong penolakan dan persilangan kelas aksara, yang boleh bercanggah dengan '-' yang tidak dapat dielakkan.

Resolusi

Untuk menyelesaikan isu ini, pastikan bahawa '-' pada akhir kelas aksara terlepas apabila menggunakan bendera 'v'. Sebagai contoh, versi corak yang diperbetulkan ialah:

^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9]+\.[a-zA-Z0-9]+$

Nota Tambahan

• Apabila menggunakan bendera 'u', tiada sekatan apabila melarikan diri daripada aksara '-'.
• Ralat yang dilemparkan apabila menggunakan corak tidak sah dengan bendera 'v' berguna untuk penyahpepijatan.
• Bendera 'v' boleh dinyatakan secara eksplisit semasa membuat objek RegExp, tetapi penggunaannya tidak digalakkan apabila menyasarkan pelayar lama yang tidak menyokongnya.

Atas ialah kandungan terperinci Mengapakah Regex Atribut Corak HTML saya Melemparkan Ralat \'Watak Tidak Sah dalam Kelas Aksara\'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!