我有生成表格的 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="StackOverflow" title="StackOverflow 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="StackOverflow" title="StackOverflow 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>
最佳答案
试试这个语法，
$('table').on('click','td',function(){
//Your code
});
也使用 'class' 因为 'ID' 属性应该是唯一的
关于javascript - jQuery table td click 无法正常工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35078470/