Hỏi về input Javascript

Có 1 ô input
Mn cho e hỏi làm thế nào khi nhập input bấm enter hoặc click ra bên ngoài thì ô input đó chuyển thành thẻ div có value đã nhập
Xin cảm ơn !

viết code js chứ làm gì
không biết viết thì search từng bước, đã search chưa mà hỏi

5 Likes

Mấy cái trên thì e biết rồi , bắt sự kiện onkeyup onclick , sử dụng React Hook setState . Vấn để ở đây là e vẫn chưa tư duy cách giải quyết . Thêm điều kiện để bắt sự kiện thì k biết từ key word để search .

Sao lại React gì nữa kia, JS là lõi của React thì rõ rồi, nhưng làm việc với React thì nên tư duy theo React.
Cụ thể React giúp bạn update giao diện dựa trên data.

Giờ đi vào trường hợp của bạn:

  1. Giao diện gồm input và div, chỉ hiện 1 trong 2. Mặc định là input.
  2. Điều kiện để hiển thị div là khi input có giá trị = x

Thì giờ bạn chỉ cần if state = x then render div else render input. Vậy là xong rồi. Còn cái đoạn if mà bạn vẫn k biết viết thì search conditional render react

3 Likes


Là e muốn sửa trực tiếp cái task này luôn
Click cái tên thì ra ô input , rồi khi enter hoặc click chỗ khác nó sẽ ra cái tên đã nhập

Vì Javascript e chỉ biết cái cơ bản mà qua học React nên nhiều thứ còn khó khăn

Tư duy hướng làm sẽ như sau:

  1. Click vào input thì tức là đang focus vào input, tìm hiểu về onfocus
  2. Click ra ngoài thì là hết focus, tìm hiểu trái ngược của onfocus là gì?
  3. Enter là sự kiện bàn phím, google on enter event keyboard, how to know user pressed enter key?

Đây đều là JS thường, giống với onclick ấy, thì sang react nó phải là onClick.
Kiến thức JS chỉ dừng ở đây. Còn lại bạn tư duy theo React như comment trước của mình.

5 Likes

Bạn thực hành thêm JS, sau đó dùng các thể loại framework, library sẽ mượt hơn.

1 Like
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?