Thuộc tính readOnly của HTML DOM Input Week

Thuộc tính readOnly của đối tượng Input Week trong HTML DOM xác định ô chọn tuần/năm có cho phép chỉnh sửa hay không. Khi true, người dùng không thể thay đổi nhưng vẫn focus, copy được, giá trị vẫn gửi khi submit.

Cú pháp

Lấy giá trị boolean

inputWeekObject.readOnly

Thiết lập readOnly

inputWeekObject.readOnly = booleanValue

Các giá trị boolean

Ví dụ minh họa

Ô week giá trị 2019-W36. Nhấn nút xác nhận sẽ đặt readOnly=true (khóa tuần):

<!DOCTYPE html>
<html>
<head>
<title>Input Week readOnly</title>
<style>
  form { width: 70%; margin: 0 auto; text-align: center; }
  * { padding: 2px; margin: 5px; }
  input[type="button"] { border-radius: 10px; }
</style>
</head>
<body>
<form>
  <fieldset>
    <legend>Week-readOnly</legend>
    <label for="WeekSelect">Tuần thi: <input type="week" id="WeekSelect" value="2019-W36"> </label> 
    <input type="button" onclick="xacNhanTuan()" value="Xác nhận tuần"> 
    <div id="divDisplay"></div> 
  </fieldset> 
</form> 
<script> 
  var divDisplay = document.getElementById("divDisplay"); 
  var inputWeek = document.getElementById("WeekSelect"); 
  divDisplay.textContent = 'Tuần đã xác nhận: ' + inputWeek.readOnly; 
  function xacNhanTuan() { 
    inputWeek.readOnly = true; 
    divDisplay.textContent = 'Tuần đã xác nhận: ' + inputWeek.readOnly; 
  } 
</script> 
</body> 
</html>

Kết quả

• Ban đầu: ô week 2019-W36, hiển thị "Tuần đã xác nhận: false".
• Nhấn Xác nhận tuần: ô week bị khóa (thường xám nhẹ), hiển thị "Tuần đã xác nhận: true".

Khác biệt disabled: readOnly vẫn submit giá trị, cho focus. disabled không submit, không focus.