jquery получить значение проверенного переключателя при загрузке или изменении

Question

Получил этот скрипт, который получает значение проверенного переключателя и распечатывает его в другом теге. Он отлично работает, когда вы нажимаете переключатель, но я понял, что мне нужно, чтобы некоторые из переключателей были отмечены по умолчанию.

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

$("input[type='radio']").click(function(){ 
    var radioValue = $(this).val(); 
    if(radioValue){ 
     $(this).closest('section').find('h2 .value').text(radioValue); 
    } 
}); 

Fiddle: https://jsfiddle.net/tactics/bykf31e6/4/

Answer 1

Вы можете использовать селектор :checked, чтобы найти все проверенные :radio элементы на нагрузке, а также петлю над ними, чтобы установить значение соответствующего элемента .value. Попробуйте это:

$(":radio:checked").each(function() { 
    $(this).closest('section').find('h2 .value').text(this.value); 
}); 

Example fiddle

Обратите внимание, что вы должны использовать change событие для связывания с радио и CheckBox элементов, чтобы удовлетворить тех, кто навигации веб-сайтов с помощью своих клавиатур. Кроме того, если вы снимите флажок, что элемент радио имеет значение (которое является излишним, поскольку они должны всегда имеют значение) можно упростить код:

$("input[type='radio']").change(setText); // when user selects 
$(":radio:checked").each(setText); // onload 

function setText() { 
    $(this).closest('section').find('h2 .value').text(this.value); 
} 

Example fiddle