입력이 URL인지 여부를 정기적으로 확인하는 JS의 기능도 웹 페이지에서 매우 일반적입니다. 친근한 링크와 양식으로 개인 홈페이지를 작성할 때 JavaScript를 사용하여 URL인지 확인하십시오.
이 테스트는 쓰기가 쉽지 않으므로 정규식을 사용하여 인증하는 것이 좋습니다.
입력은 http : // 및 https : //에서만 시작할 수 있으며 URL이어야합니다.
어떤 사람들은 왜 www.1.com과 같은 웹 페이지가 작동 할 수 없는가?
이는 사용자 입력을 사용하여 하이퍼 링크를 만들 때, A 태그의 HREF 속성이 http : // 또는 https : //에 맞지 않으면 루트 디렉토리로 간주 된 다음 웹 사이트 URL 뒤에이 주소를 작성하고 점프한다는 사실을 피하는 것입니다. 모두가 이것을 알아야합니다. 예를 들어, <a href = "www.1.com"> xxx </a> 인 경우 내 URL은 http : // localhost입니다. 그런 다음 XXX로 표시된 A 태그를 클릭 한 후 http : //localhost/www.1.com으로 이동하면 물론 잘못되었습니다.
예를 들어, 다음 텍스트 상자에서 일반 표현식을 사용하여 사용자가 http : // 및 https : //로 시작하여 URL을 입력 해야하는 방법.
1. 우선, 그것은 말할 것도없이 간단한 레이아웃입니다.
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w.w.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><Html xmlns = "http://www.w3.org/1999/xhtml"> <head> <head> <meta http-equiv = "content-type"content = "text/html; charset = utf-8"/<title> 제목이 붙은 문서 </title> </head> <body> http :/http :/http :/http :/https :/https an url^_^! <br/> <입력 유형 = "text"id = "url"/> <버튼 onclick = "checkurl ()"> 확인 </button> </body> </html>
2. 두 번째는 대본이며 실제로는 말할 필요가 없습니다. 열쇠는 정규 표현입니다.
<cript> function checkurl () {var url = document.getElementById ( "url"). 값; var reg =/^([HH] [tt] {2} [pp] : /// | if (! reg.test (url)) {alert ( "이 URL은 http : // https : //로 시작하지 않거나 URL!"); } else {alert ( "입력 성공"); }} </script>에서 : var reg =/^([hh] [tt] {2} [pp] : /// | [hh] [tt] {2} [pp] [ss] : ///) ([[a-za-z0-9- ~]+)/.)+([a-za-z0-9- ~ //])+$/;
1. JavaScript에서 모든 변수가 var이므로 정규 표현식은 두 개의 슬래시로 작성 되어야합니다.
2. ^는 ..., []는 테스트 단위, 즉 특정 캐릭터가 수용 할 수있는 것을 의미한다는 것을 의미합니다. 예를 들어, ^([hh] [tt] {2} [pp] : /// | [hh] [tt] {2} [pp] [ss] : ////), http : // 또는 https : //로 시작해야 함을 의미합니다. | 예, 첫 번째 문자는 h 또는 h이고, 두 번째와 세 번째 문자는 [tt], {2}는이 문자를 포함하고 1 인물이 [tt]이어야한다는 것을 의미합니다.
3 .
문자 +는 : "Candy"에서 'a'a 'a'in "caaaaaaandy"에서 + 부호 1 또는 n 번 앞에서 문자를 일치시킵니다.
4. ([[a-za-z0-9- ~]+)/.)+ xxx를 의미합니다. 점으로 끝나는이 일은 캐릭터 ([a-za-z0-9- ~ //])+$ 전에 한 번 이상 나타납니다.
5. $는 대문자, 소문자, 숫자, 마이너스 표지판으로 끝나야한다는 것을 의미합니다.
위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.