Làm cho ô văn bản trống sau khi nhấp nút trong JavaScript

Để làm điều này, bạn có thể sử dụng onclick="yourFunctionName()", và:

document.getElementById("").value = ''

Ví dụ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<input type="text" id="txtBox" placeholder="Nhập giá trị...."/>
<button type="button" id="clear" onclick="clearTheTextField()">ClearInputText</button>
<script>
  function clearTheTextField() {
    console.log("Giá trị hộp văn bản =" + document.getElementById('txtBox').value)
    document.getElementById('txtBox').value = '';
  }
</script>
</body>
</html>

Để chạy chương trình trên, chỉ cần lưu tên tệp anyName.html (index.html) và nhấp chuột phải vào tệp và chọn tùy chọn open with live server trong trình soạn thảo VS Code.

Kết quả

Chương trình sẽ cho ra kết quả sau:

Bây giờ nhập một số giá trị vào hộp văn bản và nhấp nút ClearInputText.

Sau khi nhập giá trị, nhấp nút.

Chương trình sẽ cho ra kết quả sau: