Đặt lại màu đường viền của điều khiển đầu vào (HTML/Javascript)

Question

Có ai biết cách đặt lại màu đường viền của điều khiển đầu vào khi bạn đã sửa đổi nó bằng javascript không? Hữu ích để xác thực bằng cách đánh dấu các trường có dữ liệu không chính xác hoặc không hợp lệ trong chúng, v.v.

Ví dụ: thay đổi đường viền:

document.getElementById('myinput').style.border = '1px solid red'; 

cách đặt lại? dòng tiếp theo chỉ cần loại bỏ các biên giới hoàn toàn ...

document.getElementById('myinput').style.border = ''; 

nếu tôi thiết lập lại màu biên giới trở lại một màu sắc cụ thể (ví dụ như màu đen hoặc màu xám vv), nó có thể trông lạ trong một số trình duyệt/hệ điều hành loại 'chủ đề' các điều khiển ...

thanks heaps!

Answer 1

Không làm điều đó với các thuộc tính kiểu thiết lập. Làm điều đó bằng cách sử dụng các lớp CSS. Tôi cũng khuyên bạn nên sử dụng thư viện Javascript để xử lý việc này. Nó chỉ làm cho mã sạch hơn.

Xóa thuộc tính CSS có vấn đề bởi vì bạn không phải lúc nào cũng biết chúng nên được đặt lại là gì. Thêm và loại bỏ các lớp học chỉ ... hoạt động.

Bạn có thể có nhiều lớp cho mỗi phần tử để thực sự không có đối số nào chống lại việc thực hiện theo cách này (imho).

Tôi đã quen với jQuery nên ví dụ của tôi là với điều đó.

cách sai:

$("#myinput").css("border", "1px solid red"); 

đúng cách:

<style type="text/css"> 
.redborder { border: 1px solid red; } 
</style> 

<script type="text/javascript"> 
$("#myinput").addClass("redborder"); 
$("#myinput").removeClass("redborder"); 
$("#myinput").toggleClass("redborder"); 
</script> 

Answer 2

Bạn chỉ đơn giản là muốn biên giới ra đi? Tôi không nghĩ như vậy, như bạn đã nói rằng đó không phải là trường hợp.

Cách thích hợp để "đặt lại" là đặt thành mặc định. Tôi không chắc chắn những gì mặc định là, nhưng tôi sẽ đoán một cái gì đó như '1px đen' hoặc tương tự.

Tôi thường sử dụng kỹ thuật này trong nhiều ứng dụng khác nhau. Khi tôi không biết mặc định, tôi sẽ đặt "mặc định" của riêng mình để tôi có thể lặp lại nó. Một trong những kỹ thuật yêu thích của tôi, với các trang web, là đặt màu nền của điều khiển, chứ không phải là đường viền. Nó rất dễ nhìn thấy và bạn có thể chọn một màu sắc bị tắt tiếng nhiều hơn và vẫn có tác động. Trong trường hợp đó, nó rất dễ dàng để thiết lập nền trở lại màu trắng, đó là mặc định.

Answer 3

này làm việc cho tôi:

document.getElementById('myinput').style.removeProperty('border');