Jquery表td点击不正常

时间:2021-11-26 21:27:12

I have php code wich generates table. Inside td I have inserted img. When user click on td then it changes img inside it. But it is not working properly. Only even rows td element changes image while odd rows doesn't. Below is my code:

我有PHP代码生成表。在td里面我插入了img。当用户点击td然后它在其中更改img。但它无法正常工作。只有偶数行td元素才会改变图像,而奇数行则不会。以下是我的代码:

    <div class="row" id="atten_list">
        <div class="col-sm-offs-3 col-md1-6">
            <table class="table table-bordered">
                <thead>
                    <tr>
                        <td><?php echo get_phrase('roll');?></td>
                        <td><?php echo get_phrase('name');?></td>
                        <td><?php echo get_phrase('1');?></td>
                        <td><?php echo get_phrase('2');?></td>
                        <td><?php echo get_phrase('3');?></td>
                        <td><?php echo get_phrase('4');?></td>
                        <td><?php echo get_phrase('5');?></td>
                        <td><?php echo get_phrase('6');?></td>
                        <td><?php echo get_phrase('7');?></td>
                        <td><?php echo get_phrase('8');?></td>
                        <td><?php echo get_phrase('9');?></td>
                        <td><?php echo get_phrase('10');?></td>
                        <td><?php echo get_phrase('11');?></td>
                        <td><?php echo get_phrase('12');?></td>
                        <td><?php echo get_phrase('13');?></td>
                        <td><?php echo get_phrase('14');?></td>
                        <td><?php echo get_phrase('15');?></td>
                        <td><?php echo get_phrase('16');?></td>
                        <td><?php echo get_phrase('17');?></td>
                        <td><?php echo get_phrase('18');?></td>
                        <td><?php echo get_phrase('19');?></td>
                        <td><?php echo get_phrase('20');?></td>
                        <td><?php echo get_phrase('21');?></td>
                        <td><?php echo get_phrase('22');?></td>
                        <td><?php echo get_phrase('23');?></td>
                        <td><?php echo get_phrase('24');?></td>
                        <td><?php echo get_phrase('25');?></td>
                        <td><?php echo get_phrase('26');?></td>
                        <td><?php echo get_phrase('27');?></td>
                        <td><?php echo get_phrase('28');?></td>
                        <td><?php echo get_phrase('29');?></td>
                        <td><?php echo get_phrase('30');?></td>
                        <td><?php echo get_phrase('31');?></td>
                    </tr>
                </thead>
                    <tbody>

                        <?php 
                        $students   =   $this->db->get_where('student' , array('class_id'=>$class_id))->result_array();

                        foreach($students as $row):

                            ?>
                            <tr class="gradeA" id="adata">
                                <td><?php echo $row['roll'];?></td>
                                <td><?php echo $row['name'];?></td>
                                <?php
                                for($i=1; $i<=31; $i++){ ?><?php
                                    $datea = $i;
                                    $full_date  =   $year.'-'.$month.'-'.$datea;

                                    //inserting blank data for students attendance if unavailable
                                    $verify_data    =   array(  'student_id' => $row['student_id'],
                                                                'date' => $full_date);
                                    $query = $this->db->get_where('attendance' , $verify_data);
                                    if($query->num_rows() < 1){
                                    $this->db->insert('attendance' , $verify_data);}

                                    //showing the attendance status editing option
                                    $attendance = $this->db->get_where('attendance' , $verify_data)->row();
                                    $status     = $attendance->status;
                                    $id = $attendance->attendance_id;
                                ?>
                            <?php if ($status == 1):?>
                                <td align="center" id="status" title="<?php echo $id; ?>">
                                <img src="<?php echo base_url("/assets/images/present.png"); ?>" alt="*" title="* is the best!" />  
                                </td>
                            <?php endif;?>
                            <?php if ($status == 2):?>
                                <td align="center" id="status" title="<?php echo $id; ?>">
                                <img src="<?php echo base_url("/assets/images/absent.png"); ?>" alt="*" title="* is the best!" />  
                                </td>

                            <?php endif; ?><?php }?><?php $this->db->where('class_id',$class_id);
    $this->db->from('student');
    $nofs = $this->db->count_all_results(); ?>

<!-- Script for changing image on td click -->
                                        <script>
$("table tbody tr#adata td#status").click(function() {
      var img = $(this).find("img")[0];
      if(img.src == '<?php echo base_url("/assets/images/present.png"); ?>'){
      img.src = img.src.replace('<?php echo base_url("/assets/images/present.png"); ?>', '<?php echo base_url("/assets/images/absent.png"); ?>');   

      }
      else if(img.src == '<?php echo base_url("/assets/images/absent.png"); ?>'){  img.src = img.src.replace('<?php echo base_url("/assets/images/absent.png"); ?>', '<?php echo base_url("/assets/images/present.png"); ?>');
      }else{}
    }); </script> 
                            </tr>
                        <?php endforeach;?>

                </tbody>
            </table>
        </div>
    </div>

1 个解决方案

#1


0  

Try this syntax ,

试试这个语法,

$('table').on('click','td',function(){
 //Your code
});

Also use 'class' since 'ID' attrib should be unique

也可以使用'class',因为'ID'attrib应该是唯一的

#1


0  

Try this syntax ,

试试这个语法,

$('table').on('click','td',function(){
 //Your code
});

Also use 'class' since 'ID' attrib should be unique

也可以使用'class',因为'ID'attrib应该是唯一的