admin管理员组

文章数量:1353245

I'm looping through a form and showing content that matches my selected id's. The problem is that some divs contain more than one id in which case it stops working. Any ideas? Thanks.

Jquery Code:

$('#myForm').find('div').each(function() {
        var myId = $(this).attr('id');

        /* This will work */
        if (myId == "Select1"){
                $(this).removeClass("hideMe");
                $(this).addClass("showMe");
                }
        /* This does not work */
        else if (myId == "Select4"){
                $(this).removeClass("hideMe");
                $(this).addClass("showMe");
                }
        else{}

        }); 

HTML Code:

<div class="hideMe" id="Select1">
<p>Some Content</p>
</div>

<div class="hideMe" id="Select2 Select3 Select4 Select5">
<p>Some Content</p>
</div>

I'm looping through a form and showing content that matches my selected id's. The problem is that some divs contain more than one id in which case it stops working. Any ideas? Thanks.

Jquery Code:

$('#myForm').find('div').each(function() {
        var myId = $(this).attr('id');

        /* This will work */
        if (myId == "Select1"){
                $(this).removeClass("hideMe");
                $(this).addClass("showMe");
                }
        /* This does not work */
        else if (myId == "Select4"){
                $(this).removeClass("hideMe");
                $(this).addClass("showMe");
                }
        else{}

        }); 

HTML Code:

<div class="hideMe" id="Select1">
<p>Some Content</p>
</div>

<div class="hideMe" id="Select2 Select3 Select4 Select5">
<p>Some Content</p>
</div>
Share Improve this question asked Jun 15, 2011 at 21:17 user800426user800426 1831 gold badge1 silver badge9 bronze badges 4
  • 4 i will be the first to say, WTF – Jason Commented Jun 15, 2011 at 21:19
  • The problem is that divs cannot have multiple IDs. See this question: stackoverflow./q/192048/206403 – gen_Eric Commented Jun 15, 2011 at 21:19
  • According to the specification an id cannot contain spaces. So your HTML is not valid. And if you do invalid HTML it means that everything that happens from this moment on is undefined behavior. And, hey, this behavior might differ among browsers. So start by fixing your HTML first. – Darin Dimitrov Commented Jun 15, 2011 at 21:19
  • 1 @Rocket Actually nothing can have multiple IDs. – Tadeck Commented Jun 15, 2011 at 21:20
Add a ment  | 

5 Answers 5

Reset to default 10

There is no such thing as "multiple ids".

https://developer.mozilla/en/XUL/Attribute/id

According to the standard, any string data within the id property is regarded as a part of the value.

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

reference: http://www.w3/TR/REC-html40/types.html#type-name

There's another way, though! You can have all sorts of class names, and you can use jQuery to grab an element by class name.

HTML

<div class="hideMe Select1">
<p>Some Content</p>
</div>

<div class="hideMe Select2 Select3 Select4 Select5">
<p>Some Content</p>
</div>

Javascript

$('.Select2')[0]

The [0] part of that is because when you get elements by class name, there can be several. The jQuery selector returns an array, so you're just grabbing the first one.

You can't have multiple ids. However, you can have multiple classes if you wish.

It's not valid to have multiple ID's - the browser will see id="Select2 Select3 Select4 Select5" as a single string, but that string will be invalid because it contains spaces.

From the HTML data types spec: http://www.w3/TR/REC-html40/types.html#type-name

You should use classes for this, I think.

ID's are unique and elements can only have 1 ID!

Use multiple classes instead.

An element shouldn't have more than one unique identifier that's why it's actually called an id: to identify it against all others. Anyway, you have to test if myId contains Select4 rather than testing the equality.

本文标签: javascriptMatching when element has multiple idsStack Overflow