javascript - jQuery $.each multiple div names - Stack Overflow

admin管理员组

文章数量:1403203

Hello following problem, i need the id attribute string for each div in a loop how i can make this ?

<div id="3r23r32_ProgressBar" class="upload-progress-bar"></div>
<div id="gfdgfdgfd_ProgressBar" class="upload-progress-bar"></div>

Here is my sample jquery code which does nothing -.-

$.each("div.upload-progress-bar", function (index,value) {

    alert(index);

    $('#' + value + 'ProgressBar').animate({
        'width': 10 + '%'
    }, 250).animate({
        'width': 25 + '%'
    }, 250).animate({
        'width': 65 + '%'
    }, 250).animate({
        'width': 95 + '%'
    }, 250).animate({
        'width': 100 + '%'
    }, 250);
});

Hello following problem, i need the id attribute string for each div in a loop how i can make this ?

<div id="3r23r32_ProgressBar" class="upload-progress-bar"></div>
<div id="gfdgfdgfd_ProgressBar" class="upload-progress-bar"></div>

Here is my sample jquery code which does nothing -.-

$.each("div.upload-progress-bar", function (index,value) {

    alert(index);

    $('#' + value + 'ProgressBar').animate({
        'width': 10 + '%'
    }, 250).animate({
        'width': 25 + '%'
    }, 250).animate({
        'width': 65 + '%'
    }, 250).animate({
        'width': 95 + '%'
    }, 250).animate({
        'width': 100 + '%'
    }, 250);
});

• javascript
• jquery

Share Improve this question Follow asked Jan 9, 2012 at 17:24 Sascha HeimSascha Heim 31311 gold badge44 silver badges1515 bronze badges 4

• 3 $.each() isn't used that way... are you sure you didn't mean $(sel).each() instead? – J. Holmes Commented Jan 9, 2012 at 17:27
• @32bitkid- $.each() can be used that way ;). – Matt Cashatt Commented Jan 9, 2012 at 17:28
• 1 why not just call .animate on your $('div.upload-progress-bar') selector...? – RYFN Commented Jan 9, 2012 at 17:29
• @MatthewPatrickCashatt: To iterate the characters in a string? I suppose it may work in some browsers, but it won't do what OP is trying to do. – user1106925 Commented Jan 9, 2012 at 17:31

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 7

In the callback function, this refers to each of the elements you are looping trough, so you don't need the ID at all to animate the element. Just call $(this).animate(

But in order to iterate trough the div elements, you have to use $("div.upload-progress-bar").each(function(

this.id

will get you the id attribute's text of the current element.

Example of proper .each()...

$("div.upload-progress-bar").each(function (index,value) {
    alert(this.id);
});

See Darhazer's Answer for an answer that will probably help your use case.

valuetry this

$("div.upload-progress-bar").each(function (index,elem) {

    var value = $(elem).attr("id"); // try elem.id, i guess that would work too

    $('#' + value).animate({ // you must remove ProgressBar it is included in the value variable
        'width': 10 + '%'
    }, 250).animate({
        'width': 25 + '%'
    }, 250).animate({
        'width': 65 + '%'
    }, 250).animate({
        'width': 95 + '%'
    }, 250).animate({
        'width': 100 + '%'
    }, 250);
});

You want $(...).each not $.each

It also doesn't look to me like you actually need the id at all - use this

$("div.upload-progress-bar").each(function (index,value) {
    //use `this` and `this.id` if you _really_ need the id
    $(this).animate(
        //...
      )
 });

Try this:

$("div.upload-progress-bar").each(function (index,value) {

    alert($(this).attr("id"));

    $('#' + value + 'ProgressBar').animate({
        'width': 10 + '%'
    }, 250).animate({
        'width': 25 + '%'
    }, 250).animate({
        'width': 65 + '%'
    }, 250).animate({
        'width': 95 + '%'
    }, 250).animate({
        'width': 100 + '%'
    }, 250);
});

本文标签： javascriptjQuery each multiple div namesStack Overflow