Ссылка HTML-элементов по имени (с квадратными скобками в них) с помощью JavaScript

Question

Привет всем, я пытаюсь скрыть / показать различные элементы html (div и т. Д.) В зависимости от того, установлен ли флажок или выбрано определенное значение из раскрывающегося списка. Мне было интересно, если кто-нибудь может мне помочь. Элемент html определен в соответствии с этим (ниже), и я не уверен, как ссылаться на него по имени с помощью скобок. На странице, которую я использую, включен jquery, и я хотел бы использовать ее, если это возможно. Спасибо!

<input type="checkbox" name="addons[2]" />

Также - я не могу изменить код флажка.

Answer 1

jQuery для проверки, проверен ли элемент:

$("input[name='addons[2]']").attr("checked")

jQuery для зацикливания таких элементов, которые проверяются:

$("input[name^='addons']:checked").each(function() {
    // ...
});

Answer 2

Спасибо за помощь, вот окончательный код, который я использовал

$("input[name='customfield[4]']").click(

    function()
    {
        if ($("input[name='customfield[4]']").is(":checked"))
        {
            $("#addons").hide();
        }
        else
        {
            $("#addons").show();
        }
    }
);

Answer 3

Вот решение inline non-jQuery, которое обходит необходимость полностью ссылаться на квадратные скобки, используя ключевое слово javascript this. Предполагая, что вы хотите показать / скрыть <div> с помощью id="mydiv":

<input type="checkbox" name="addons[2]" onclick="document.getElementById('mydiv').style.display = (this.checked ? 'block' : 'none');" />

Answer 4

избегайте использования [] в именах html-элементов