Блог

Я хочу добавить границу (не контур) к значению «ДА», когда переключатель «Да» установлен. Я могу поместить onchange событие на переключатель ввода, но я не могу добавить границу к значению «ДА», поскольку нет тега label. Как мне это сделать с помощью jquery / javascript?

Я пытался

 $("input:radio[name='registered'][value='yes']").css("border","3px solid red");
  

но это даже не дает флажку границы (работает, только если я изменяю на outline), не говоря уже о значении флажка. Есть мысли? В идеале HTML-файл должен быть нетронутым, а все изменения внесены в js-файл. В примерах, которые я вижу, в основном добавлены теги label или divs, но здесь нет никаких тегов, которые я мог бы использовать. я пробовал .value.css(), но это недопустимо.

 <form name="input" method="get">
        <span>Registered:</span>
        <input type="radio" name="registered" value="yes">YES  
        <input type="radio" name="registered" value="no" checked disabled>NO
</form>
  

Вы используете любой элемент в тексте «ДА» или «НЕТ«

 $(document).ready(function() {
    $("input[type=radio]").click(function(e) {
       $(this).next("span").css("border","2px solid red");
    });
});  

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="input" method="get">
   <span>Registered:</span>
   <input type="radio" name="registered" value="yes">
   <span>YES</span> 
   <input type="radio" name="registered" value="no" checked disabled>
   <span>NO</span>
</form>  

Javascript не требуется. Вы можете использовать :checked селектор. Также вы должны обернуть свой текст с помощью span.

 input[type="radio"]:checked:not(:disabled)   span{
  border: 2px solid red;
}  

 <form name="input" method="get">
  <span>Registered:</span>
  <input type="radio" name="registered" value="yes"><span>YES</span>
  <input type="radio" name="registered" value="no" checked disabled><span>NO</span>
</form>