Computer >> Máy Tính >  >> Lập trình >> HTML

HTML DOM Mẫu URL đầu vào Thuộc tính

Thuộc tính mẫu URL đầu vào HTML DOM đặt / trả về biểu thức chính quy tương ứng với Đầu vào URL. Giá trị của thuộc tính mẫu được kiểm tra dựa trên văn bản được nhập trong trường url.

Sytax

Sau đây là cú pháp -

  • Trả về biểu thức chính quy
inputURLObject.pattern
  • Đặt mẫu sang biểu thức chính quy
inputURLObject.pattern = ‘RegExp’

Ví dụ

Hãy để chúng tôi xem ví dụ về Mẫu URL đầu vào tài sản -

<!DOCTYPE html>
<html>
<head>
<title>Input URL pattern</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="submit"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form onsubmit="checkPattern()">
<fieldset>
<legend>URL-pattern</legend>
<label for="URLSelect">URL :
<input type="url" id="URLSelect" pattern="https?://www.+[a-zA-Z0-9]+.com">
</label>
<input type="submit" value="Submit">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputURL = document.getElementById("URLSelect");
   divDisplay.textContent = 'pattern: '+inputURL.pattern;
   function checkPattern() {
      if(inputURL.value !== ''){
         alert("Redirecting to "+User);
      }
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Trước khi nhấp vào ‘Gửi’ nút -

HTML DOM Mẫu URL đầu vào Thuộc tính

Sau khi nhấp vào ‘Gửi’ nút có mẫu không hợp lệ -

HTML DOM Mẫu URL đầu vào Thuộc tính

Sau khi nhấp vào ‘Gửi’ nút có mẫu hợp lệ -

HTML DOM Mẫu URL đầu vào Thuộc tính