JavaScript: focus() và blur()

Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực

Cách thức cư xử của hai phương thức focus() blur() giống hệt với hai sự kiện onFocus và onBlur. Các phương thức này áp dụng cho một đối tượng nào đó, và chúng sẽ được gọi từ chương trình JavaScript. Khi phương thức focus() được áp dụng thì có nghĩa là đối tượng tương ứng đang được focus, và ngược lại khi phương thức blur() được áp dụng thì có nghĩa đối tượng không còn được focus nữa.

Ví dụ dưới đây minh họa cách sử dụng hai phương thức focus() và blur().

    <html>

    <head><title>The focus and blur methods</title>

    <script language="JavaScript">

1       function newWindow(){

2           winObj=window.open("summertime.jpg",

            "summer","width=650,height=200,resizable=yes,

            scrollbars=yes,location=yes");

3           winObj.moveTo(0,0); // Chuyển cửa số mới tới góc trên bên trái

4           winObj.focus(); // Focus vào cửa sổ mới

            //windObj.blur();

        }

5       function closeWindow(){

6           winObj.close(); //Đóng cửa sổ mới

        }

    </script>

    </head>

    <body bgColor="lightgreen">

    <h2>Summer Scene from the Old Country</h2>

    <form>

        <input type=button

            value="Open Window"

7           onClick="javascript:newWindow();">

        <input type=button

            value="Close Window"

8           onClick="javascript:closeWindow();">

    </form>

    </body>

    </html>

 

GIẢI THÍCH

  1. Hàm newWindow() do ta định nghĩa sẽ tạo một đối tượng cửa sổ mới bằng phương thức open() của đối tượng window, cửa số mới được tạo ra có các đặc điểm đi theo các tùy chọn trong phần đối số của open().
  2. Đối tượng cửa sổ mới là một ảnh có tên summertime.jpg.
  3. Cửa sổ mới được di chuyển tới tọa độ (0,0).
  4. Cửa sổ mới được focus. Nó sẽ nằm trên các cửa sổ khác.
  5. Hàm do ta tự định nghĩa để đóng cửa sổ mới.
  6. Phương thứcThe close() của đối tượng window sẽ đóng cửa sổ mới.
  7. Khi người dùng click vào nút này thì sự kiện onClick được kích hoạt, và một cửa sổ mới sẽ được mở.
  8. Khi người dùng click vào nút này thì cửa sổ mới sẽ được đóng.
» Tiếp: 20 cách thực hành tốt nhất để cải thiện hiệu suất JavaScript
« Trước: Mảng (Array)
Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực
Copied !!!