Добавить класс в переключатель, если он установлен

Я хочу добавить класс 'selected' в оба флажка и переключатели, если они отмечены. Я нашел ниже код онлайн, чтобы он работал с флажками.Добавить класс в переключатель, если он установлен

Что нужно изменить, чтобы включить переключатели в код?

<script> 
 
\t \t var inputs = document.getElementsByTagName("input"); 
 
var checkboxes = []; 
 

 
for (var i = 0; i < inputs.length; i++) { 
 
    if (inputs[i].type == "checkbox") { 
 
    checkboxes.push(inputs[i]); 
 
    if (inputs[i].checked) { 
 
     checked.push(inputs[i]); 
 
    } 
 
    } 
 
} 
 

 
for (var j = 0; j < checkboxes.length; j++) { 
 
    checkboxes[j].onclick = function() { 
 
     if (this.checked == true) { 
 
      this.className += " selected"; 
 
     } else { 
 
      removeClassName(this, 'selected'); 
 
     } 
 
    } 
 
} 
 

 
function removeClassName(e,t) { 
 
    if (typeof e == "string") { 
 
     e = xGetElementById(e); 
 
    } 
 
    var ec = ' ' + e.className.replace(/^\s+|\s+$/g,'') + ' '; 
 
    var nc = ec; 
 
    if (ec.indexOf(' '+t+' ') != -1) { 
 
     nc = ec.replace(' ' + t + ' ',' '); 
 
    } 
 
    e.className = nc.replace(/^\s+|\s+$/g,''); 
 
    return true; 
 
} 
 
\t \t </script>

источник

2017-02-23 Phil Verheij

Ваш фрагмент кода показывает ошибку. * SyntaxError: ожидаемое выражение, got '<' * – Jer

Вам не нужно JavaScript.

Существует селектор CSS для этого, это :checked

input[type="radio"]:checked { 
    /* Use the css of selected class */ 
}

источник

2017-02-23 11:03:10 R3tep

По какой-то причине некоторые плагины в Wordpress удалены эти данные. Вот почему я хочу добавить дополнительный класс ко всем переключателям и флажкам. Ниже приведен пример (эта коробка теперь проверена):

<input id="payment_method_mollie_wc_gateway_ideal" type="radio" class="input-radio" name="payment_method" value="mollie_wc_gateway_ideal" data-order_button_text="">

источник

2017-02-23 11:17:22

Если я понимаю ваш код правильно, я предполагаю, что вы должны изменить if (inputs[i].type == "checkbox") { (вокруг линии 5) с if (inputs[i].type == "checkbox" || inputs[i].type == "radio") {, то она должна также включают радиокнопки.

источник

2017-02-23 11:17:33 Daarin

Я тоже это пробовал ... Тогда ничего не происходит с радиообменами, и я получаю эту ошибку: непроверьте ReferenceError: checked не определен –

Вот источник JSFiddle https://jsfiddle.net/rj1405/Lnv70bsu/14/

Вместо того, чтобы добавить имя класса как

this.className += " selected";

Я пытаюсь Тхо добавить через Javascript метод

inputs[i].classList.add('selected');

пожалуйста, найти ниже код для Вашего Справка.

var inputs = document.getElementsByTagName("input"); 
 

 
for (var i = 0; i < inputs.length; i++) { 
 
    if (inputs[i].type == "checkbox" || inputs[i].type == "radio") { 
 
    if (inputs[i].checked) { 
 
    \t inputs[i].classList.add('selected'); 
 
    \t // console.log(inputs[i].classList); 
 
      // console.log(inputs[i]); 
 
    } 
 
    } 
 
}


 

 
<input type="radio" name="imgsel" value="" checked="checked" /> 
 
    <input type="radio" name="imgse2" value="" checked/> 
 
    <input type="checkbox" name="vehicle" value="Car" checked>

источник

2017-02-23 12:11:27

Добавить класс в переключатель, если он установлен

ответ

Смежные вопросы