迭代一系列div

Question

我不得不求助于这个bodge将div01-05的高度设置为与div11-15不同:(

var maxheight = divheight;
var dayofweek = <?echo date("w",strtotime($today));?>;
var heightoffset = (2 - dayofweek) * 40;

var days = jQuery('div.day01, div.day02, div.day03, div.day04, div.day05');
for (i=0; i<days.length; i++){
    var hh = jQuery(days[i]).prop("scrollHeight");
    if (hh > maxheight) {
        maxheight = hh;
    };
    jQuery(days[i]).height(divheight+heightoffset);
};

var days = jQuery('div.day11, div.day12, div.day13, div.day14, div.day15');
for (i=0; i<days.length; i++){
    var hh = jQuery(days[i]).prop("scrollHeight");
    if (hh > maxheight) {
        maxheight = hh;
    };
    jQuery(days[i]).height(divheight-heightoffset);
};

//Back to full array for further processing
var days = jQuery('div.day01, div.day02, div.day03, div.day04, div.day05, div.day11, div.day12, div.day13, div.day14, div.day15');

有人请让我摆脱我的痛苦，并告诉我如何迭代所有的div并做一个条件集高度。

有一点需要注意的是，PHP正在对div进行调整，div.day01 -04可能不存在，具体取决于div.day05一周中的星期几，所以divs day11-15

西蒙

最终的代码结果（更正为使用id而不是类:)

    jQuery('div[id^="day"]').each(function() { 
        var hh = jQuery(this).prop("scrollHeight");
        if (hh > maxheight) {maxheight = hh;};
        var cn = jQuery(this).attr('id').split(" ")[0]; // Since PHP is creating these classes, we can safely assume "day" will always be the first.
        var num = parseInt(cn.slice(-2),10); // extract the last two characters and convert to an integer
        if (num >=1 && num <= 5) {
            jQuery(this).height(divheight+heightoffset);
        }else if(num >=10 && num <= 15){
            jQuery(this).height(divheight-heightoffset);
        }
    });

Answer 1

$('div[class^="day"]').each(function() { 
  var cn = $(this).attr('class').split(" ")[0]; // Since PHP is creating these classes, we can safely assume "day" will always be the first.
  var num = parseInt(cn.slice(-2),10); // extract the last two characters and convert to an integer
  if (num >=1 && num <= 5) {
    // Working with div 01-05
  }else if(num >=10 && num <= 15){
    // Working with div 11-15
  }
});

Answer 2

要迭代页面上的所有div，请使用

jQuery('div').each(function(d) {
    //This code will run for each div on the page
    //Just put any conditionals in here
    //Use jQuery(this) to refer to the current div
});

编辑：

使用jQuery(this).attr('name')来访问当前元素的名称。

使用jQuery(this).attr('id')来访问当前元素的id。

使用jQuery(this).hasClass('classname') （boolean）来检查当前元素是否具有指示的类。

Answer 3

你可以使用$('div')遍历页面上的每个div ，然后使用正则表达式来获得你想要的div 。 您甚至可以使用[class*="day"]限制div的jQuery循环。

$('div[class*="day"]').each(function(){
   var dayClass = this.className.match(/day\d*/);
   if(dayClass != null){ // if the div contains the class day..
     var dayID = dayClass[0].replace('day', ''); // 01, 02, 03, etc.
     if(dayID >=1 && dayID <= 5){
     }
     else if(dayID >= 11 && dayID <= 15){
     }
     else{
     }
   }
});

演示： http ： //jsfiddle.net/9kxSF/1/

这里更好的想法是给所有div sa类说“dayDiv”，以及“day01”或“day02”类，所以你可以做$('div.dayDiv')得到div你自找的。

<div class="dayDiv day01"></div>
<div class="dayDiv day02"></div>

然后在jQuery中：

$('div.dayDiv').each(function(){
    var dayClass = this.className.match(/day\d*/);
    var dayID = dayClass[0].replace('day', ''); // 01, 02, 03, etc.
    if(dayID >=1 && dayID <= 5){
    }
    else if(dayID >= 11 && dayID <= 15){
    }
    else{
    }
});