Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

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

Thuộc tính autofocus của đối tượng Input Week trong HTML DOM xác định ô chọn tuần/năm có tự động nhận focus khi trang tải xong hay không. Chỉ một phần tử trên trang được autofocus.

Cú pháp

Lấy giá trị boolean

inputWeekObject.autofocus

Thiết lập autofocus

inputWeekObject.autofocus = booleanValue

Các giá trị boolean

booleanValueChi tiết
TrueÔ week tự động focus khi tải trang.
FalseMặc định: không tự động focus.

Ví dụ minh họa

Ô week có autofocus=true, giá trị 2019-W24. Nhấn nút tắt autofocus:

<!DOCTYPE html>
<html>
<head>
<title>Input Week autofocus</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-autofocus</legend>
    <label for="WeekSelect">Tuần mục tiêu: <input type="week" id="WeekSelect" value="2019-W24" autofocus> </label> 
    <input type="button" onclick="xoaAutofocus()" value="Tắt Autofocus"> 
    <div id="divDisplay"></div> 
  </fieldset> 
</form> 
<script> 
  var divDisplay = document.getElementById("divDisplay"); 
  var inputWeek = document.getElementById("WeekSelect"); 
  divDisplay.textContent = 'Autofocus: ' + inputWeek.autofocus; 
  function xoaAutofocus() { 
    inputWeek.autofocus = false; 
    divDisplay.textContent = 'Autofocus: ' + inputWeek.autofocus; 
  } 
</script> 
</body> 
</html>

Kết quả

  • Tải trang: ô week 2019-W24 tự động focus (mở lịch chọn tuần ngay).
  • Hiển thị "Autofocus: true".
  • Nhấn Tắt Autofocus: "Autofocus: false" (hiệu lực load sau).

Lưu ý: Để focus ngay lập tức qua JS, dùng inputWeek.focus(). Autofocus chỉ tác động khi load trang.