ฟังก์ชั่นของ JS การตรวจสอบปกติว่าอินพุตเป็น URL นั้นเป็นเรื่องธรรมดามากในหน้าเว็บหรือไม่ เมื่อกรอกข้อมูลในหน้าแรกด้วยลิงก์และแบบฟอร์มที่เป็นมิตรให้ใช้ JavaScript เพื่อตรวจสอบว่าเป็น URL หรือไม่
การทดสอบนี้ไม่ใช่เรื่องง่ายที่จะเขียนดังนั้นจึงเป็นการดีกว่าที่จะใช้นิพจน์ทั่วไปเพื่อตรวจสอบสิทธิ์
มีการกำหนดว่าอินพุตสามารถเริ่มต้นด้วย http: // และ https: // และต้องเป็น URL
บางคนพูดว่าทำไมหน้าเว็บไม่สามารถทำงานได้เช่น www.1.com?
นี่คือการหลีกเลี่ยงความจริงที่ว่าเมื่อคุณใช้อินพุตผู้ใช้เพื่อสร้างไฮเปอร์ลิงก์หากแอตทริบิวต์ HREF ในแท็ก A ไม่สามารถพบสิ่งที่ http: // หรือ https: // มันจะถูกพิจารณาว่าเป็นไดเรกทอรีรูทและจะเขียนที่อยู่นี้ไว้เบื้องหลัง URL ของเว็บไซต์ของคุณแล้วกระโดด ทุกคนควรรู้เรื่องนี้ ตัวอย่างเช่นถ้า <a href = "www.1.com"> xxx </a> url ของฉันคือ http: // localhost จากนั้นหลังจากคลิกที่แท็ก A ที่แสดงเป็น XXX คุณเพียงแค่ข้ามไปยังตำแหน่ง http: //localhost/www.1.com แน่นอนว่ามันผิด
ตัวอย่างเช่นในกล่องข้อความต่อไปนี้วิธีการใช้นิพจน์ทั่วไปเพื่อให้ผู้ใช้ป้อน URL เริ่มต้นด้วย http: // และ https: //?
1. ก่อนอื่นมันเป็นเลย์เอาต์ง่าย ๆ ไม่จำเป็นต้องพูด:
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-ype" content = "text/html; charset = utf-8"/> <title> url^_^! <br/> <input type = "text" id = "url"/> <button onclick = "checkurl ()"> ยืนยัน </button> </body> </html>
2. ประการที่สองคือสคริปต์ไม่จำเป็นต้องพูด กุญแจสำคัญคือนิพจน์ทั่วไป:
<script> ฟังก์ชั่น checkurl () {var url = document.getElementById ("url") ค่า; var reg =/^([hh] [tt] {2} [pp]: //// | [hh] [tt] {2} [pp] [ss]: ////) (([a-za-z0-9- ~]+)/.)+([a-za-z0-9- ~ //] if (! reg.test (url)) {แจ้งเตือน ("URL นี้ไม่ได้เริ่มต้นด้วย http: // https: // หรือไม่ใช่ URL!"); } else {alert ("อินพุตสำเร็จ"); }} </script>ใน: var reg =/^([hh] [tt] {2} [pp]: //// | [hh] [tt] {2} [pp] [ss]: ////) ([a-za-z0-9- ~]+)
1. ในจาวาสคริปต์เนื่องจากตัวแปรทั้งหมดเป็น var นิพจน์ปกติจะต้องเขียนในสองสแลช/../จากนั้น สแลช/ในนิพจน์ปกติจะต้องเขียนเป็น //
2. ^ หมายความว่ามันจะต้องเริ่มต้นด้วย ... , [] หมายถึงหน่วยทดสอบนั่นคือสิ่งที่ตัวละครบางตัวสามารถรองรับได้ ตัวอย่างเช่น ^([hh] [tt] {2} [pp]: //// | [hh] [tt] {2} [pp] [ss]: ////) ซึ่งหมายความว่ามันต้องการว่ามันเริ่มต้นด้วย http: // หรือ https: // | ใช่ตัวละครตัวแรกคือ H หรือ H ตัวละครตัวที่สองและสามคือ [TT], {2} หมายความว่าการรวมตัวละครนี้และตัวละคร 1 ตัวหลังจากนั้นจะต้องเป็น [TT] และอื่น ๆ
3. ([A-ZA-Z0-9- ~]+) หมายความว่าการรวมตัวละครนี้และอักขระที่ตามมาจะต้องเป็นตัวพิมพ์ใหญ่ตัวอักษรตัวพิมพ์เล็กตัวเลขตัวเลขลบหรือ ~
อักขระ + หมายถึง: จับคู่อักขระก่อน + sign 1 หรือ n ครั้งตัวอย่างเช่น: /a + /match 'a' ใน "ขนม" และทั้งหมด 'a' ใน "caaaaaaandy"
4. ดังนั้น (([A-ZA-Z0-9- ~]+)/.)+ หมายถึง xxx สิ่งนี้ที่ลงท้ายด้วยจุดจะต้องปรากฏอย่างน้อยหนึ่งครั้งก่อนที่ตัวละคร ([A-ZA-Z0-9- ~ //])+$
5. $ หมายความว่าจะต้องจบลงด้วยตัวอักษรตัวพิมพ์ใหญ่ตัวอักษรตัวพิมพ์เล็กตัวเลขตัวเลขลบ -, ~, /
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น