Отметьте переключатель с помощью javascript

Question

По какой-то причине я не могу понять это.

У меня есть некоторые кнопки радио в моем HTML, который переключает категории:

<input type="radio" name="main-categories" id="_1234" value="1234" /> // All 
<input type="radio" name="main-categories" id="_2345" value="2345" /> // Certain category 
<input type="radio" name="main-categories" id="_3456" value="3456" /> // Certain category 
<input type="radio" name="main-categories" id="_4567" value="4567" /> // Certain category 

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

Я попытался версии этого (с и без JQuery):

document.getElementById('#_1234').checked = true;

Но это, похоже, не обновлять. Мне нужно, чтобы он заметно обновился, чтобы пользователь мог его увидеть. Может ли кто-нибудь помочь?

EDIT: Я просто устал и проглядел #, спасибо, что указал, что и $.prop().

Answer 1

Не смешивать CSS синтаксис (# для идентификатора) с нативной JS

Native JS решение:

document.getElementById("_1234").checked = true;

JQuery решение:

$("#_1234").prop("checked", true);

Answer 2

Если вы хотите установить кнопку «1234», вы должны использовать свой «идентификатор»:

document.getElementById("_1234").checked = true; 

Когда вы используете браузер API («getElementById»), вы не используете синтаксис селектора; вы просто передаете фактическое значение «id», которое вы ищете. Вы используете синтаксис селектора с jQuery или .querySelector() и .querySelectorAll().

Answer 3

С помощью функции document.getElementById() вам не нужно передавать # перед идентификатором элемента.

Код:

document.getElementById('_1234').checked = true; 

Демо: JSFiddle

Answer 4

Самый простой способ, вероятно, будет с JQuery, следующим образом:

$(document).ready(function(){ 
    $("#_1234").attr("checked","checked"); 
}) 

Это добавляет новый атрибут "проверен" (который в HTML не нуждается в значении). Только не забудьте включить библиотеку JQuery:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

Answer 5

Сегодня, в 2016 году, это сохранить использовать document.querySelector, не зная идентификатор (особенно если у вас есть более чем 2 кнопки радио):

document.querySelector("input[name=main-categories]:checked").value