jquery - Reference HTML Elements by name (with square brackets in them) via javascript - Stack Overflow

admin管理员组

文章数量:1294753

Hey everyone, I am trying to hide/show different html elements (div, etc...) based on whether a checkbox is checked or if a specific value is chosen from a dropdown box. I was wondering if someone can help me out. The html element is defined along the lines of this (below), and i'm not sure how to reference it by name with brackets in it. The page i'm using has jquery enabled, and i'd like to use it if possible. Thanks!

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

Also - I cannot modify the checkbox's code.

Hey everyone, I am trying to hide/show different html elements (div, etc...) based on whether a checkbox is checked or if a specific value is chosen from a dropdown box. I was wondering if someone can help me out. The html element is defined along the lines of this (below), and i'm not sure how to reference it by name with brackets in it. The page i'm using has jquery enabled, and i'd like to use it if possible. Thanks!

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

Also - I cannot modify the checkbox's code.

• javascript
• jquery
• html
• forms

Share Improve this question Follow edited Jan 15, 2010 at 0:43 Anand Capur asked Jan 15, 2010 at 0:10 Anand CapurAnand Capur 81811 gold badge99 silver badges1818 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 5

jQuery to check if element is checked:

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

jQuery to loop over such elements that are checked:

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

Thanks for the help, here is the final code I used

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

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

Here is an inline non-jQuery solution that bypasses the need to reference the square brackets entirely by using the javascript this keyword. Assuming you want to show/hide a <div> with id="mydiv":

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

avoid using [] in naming html elements

本文标签： jqueryReference HTML Elements by name (with square brackets in them) via javascriptStack Overflow