dongsha1544
2014-10-15 19:40
浏览 29
已采纳

如何在PHP循环中更改CSS的类名?

Hello I am trying to change CSS content on some DIVs depending of their class name.

To explain better, I have a while loop in PHP reading from the database to output DIVs and I have a field named "section" with data such as A,B,C,D,E,F,G.

For the DIVs located in section "A" and "B" I want the class name to be desk_box_hor (for horizontal) ELSE I want it to desk_box_ver(vertical).

Below is what I tried doing only two sections (A,B) that need to be vertical. The others need to be horizontal. If theres a more efficient way of doing this please tell me. I have about 200 of these DIVs being output on screen.

If you have a better title please recommend one, I didn't know what to put lol.

Thanks in advance!

My fiddle of what I want both DIVs to look like

PHP:

while($row = mysqli_fetch_assoc($desk_coord_result)){   
                        //naming X,Y values
                        $id    = $row['coordinate_id'];
                        $x_pos = $row['x_coord'];
                        $y_pos = $row['y_coord'];
                        $sec_name = $row['section_name'];
                        //draw a DIV box at its X,Y coordinate   
    //if section A and B do vertical                    
    if($sec_name == 'B' || $sec_name == 'A'){
        echo '<div class="desk_box_ver" data="'.$id.'" style="position:absolute;left:'.$x_pos.'px;top:'.$y_pos.'px;">id:'.$id.'</div>';

    }
//else do it horizontal
    else{
        echo '<div class="desk_box_hor" data="'.$id.'" style="position:absolute;left:'.$x_pos.'px;top:'.$y_pos.'px;">id:'.$id.'</div>';
        }
    } //end while loop for desk_coord_result

CSS:

/* desk boxes*/
.desk_box_ver{ 
width: 23px;
height: 10px;
border: 4px solid black; 
padding:10px;
}   

.desk_box_hor{ 
width: 10px;
height: 23px;
border: 4px solid black; 
padding:10px;
}   

Also, lets say I want to use these two classes in the same Jquery function, is this the proper way of doing it?

$(".desk_box").add(".desk_box_ver").click(function() {
or
$(".desk_box, .desk_box_ver").click(function() {
  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

2条回答 默认 最新

相关推荐 更多相似问题