Сбросить цвет границы элемента управления (HTML/Javascript)

Question

Кто-нибудь знает, как сбросить цвет границы элемента управления вводом, если вы изменили его с помощью javascript? Полезно для проверки путем выделения полей с неправильными или недействительными данными в них и т. Д.

E.g. изменение границы:

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

как сбросить? следующая строка просто удаляет границу полностью ...

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

если сбросить цвет границы обратно в определенный цвет (например, черный или серый цвет и т.д.), это может выглядеть странно в некоторых браузерах/операционных систем, своего рода 'тема' управления ...

спасибо кучи!

Answer 1

Не делайте этого с настройкой атрибутов стиля. Сделайте это, используя классы CSS. Я бы также рекомендовал использовать библиотеку Javascript для этого. Это просто делает код чище.

Удаление атрибутов CSS является проблематичным, потому что вы не всегда знаете, на что они должны быть установлены. Добавление и удаление классов просто ... работает.

У вас может быть несколько классов для каждого элемента, поэтому нет аргументов против этого делать так (imho).

Я привык к jQuery, поэтому мой пример с этим.

Неправильный путь:

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

Правильный способ:

<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

Вы просто хотите границу, чтобы уйти? Я так не думаю, поскольку вы заявили, что это не так.

Правильный способ «перезагрузки» - установить значение по умолчанию. Я не уверен, что такое дефолт, но я бы предположил что-то вроде «1px black» или аналогичного.

Я обычно использую эту технику в различных приложениях. Когда я не знаю значение по умолчанию, я установлю свой собственный «по умолчанию», чтобы повторить его. Один из моих любимых методов, с веб-страницами, заключается в том, чтобы установить цвет фона элемента управления, а не границу. Он очень заметен, и вы можете выбрать более приглушенный цвет и по-прежнему оказывать влияние. В этом случае очень просто установить фон обратно на белый, который по умолчанию.

Answer 3

Это работает для меня:

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