我想使用PHP显示/隐藏使用动态ID,我可以选择并显示正确的div id,但是当我从显示div中单击edit-course时,显示div应该关闭并显示一个新的div,但我无法打开编辑课程div,这是我的代码
<?php
require 'init.php';
?>
<html>
<head>
<script src="js/jqueryv1.10.2.js"></script>
<script>
$ (function()
{
$ ('#selector').change(function()
{
$ ('.colors').hide();
$ ('#' + $(this).val()).fadeIn('slow');
});
});
$(function() {
$('.show-hide-action').click(function()
{ // bind action
$ ('.colors').hide();
$ ('#enclosure' + $(this).val()).fadeIn('slow');
});
});
</script>
</head>
<body>
<?php
echo '<div style="color:#8ac007;margin:30px;text-align:center;">
Select the course : <select id="selector">';
$sel_course = $db->query('SELECT * FROM courses');
$sel_course->execute();
echo '<option selected="selected">Select a course</option>';
while ($row = $sel_course->fetch(PDO::FETCH_ASSOC))
{
$course_name = $row['course_name'];
$id = $row['id'];
echo '<option value='.$id.'>'.$course_name.'</option>';
}
echo '</select>';
echo '</div>';
//Displaying the content
$dis_course = $db->query('SELECT * FROM courses');
$dis_course->execute();
while ($row = $dis_course->fetch(PDO::FETCH_ASSOC))
{
$course_name = $row['course_name'];
$course_id = $row['id'];
echo '<div id='.$course_id.' style="display:none;" class="colors">';
echo ''.$course_name.'(<a class="show-hide-action" style="cursor:pointer;">Edit course </a>)';
echo '</div>';
echo '<div id="enclosure('.$course_id.')" style="display:none;">'. $course_name.' </div>';
}
?>
</body>
</html>
答案 0 :(得分:0)
创建包装div。
echo "<div class='wrapper'>";
echo '<div id='.$course_id.' style="display:none;" class="colors">';
echo ''.$course_name.'(<a class="show-hide-action" style="cursor:pointer;">Edit course </a>)';
echo '</div>';
echo '<div class="enclosure" style="display:none;">'. $course_name.' </div>';
echo "</div>";
并改变你的脚本:
$(function() {
$('.show-hide-action').click(function()
{ // bind action
$ ('.enclosure').hide();
$ (this).closest('.wrapper').find('.enclosure').fadeIn('slow');
});
});