Question

我想在每个手风琴标签中使用javascript在点击时显示隐藏元素。我用了这段代码：

$(document).ready(function(){
  $("#SlideMe1b").hide();
  $("#SlideMe1a").click(function() {
    $("#SlideMe1a").hide();
    $("#SlideMe1b").slideDown();

     });
 });

但是，这仅适用于第一个手风琴标签，而不适用于其他手风琴标签。我该怎么做才能克服这个问题？

这是php大括号中的html：

echo "</form><form action='addCourse.php' method='post'>
    <p id='SlideMe1a'>Add new Course</p>
    <p id='SlideMe1b' style='display: none'>
    <input type='hidden' name='semester' value=".$allSemesters[$j][0].">
    Course ID: <input type='text' name='course_id' /><br />
    Course Name: <input type='text' name='course_name' /><br />
    <INPUT TYPE='image' SRC='images/add-course.png' BORDER='0' ALT='Submit Form' title='Add Course'>
    <p>

Answer 1

如果你在你的所有第一个手风琴标签上添加一个.accordion-tab类，或者你这样做，这应该有效。如果你使用ID，那么你需要为所有人提供单独的功能。

使用Javascript：

$(document).ready(function(){

$('.accordion-tab').click(function() {
    $(this).next('p').slideDown();  
});

});

HTML：

<p id='SlideMe1a' class='accordion-tab'>Add new Course</p>
<p id='SlideMe1b' style='display: none'>
<input type='hidden' name='semester' value=".$allSemesters[$j][0].">
Course ID: <input type='text' name='course_id' /><br />
Course Name: <input type='text' name='course_name' /><br />
</p>

Answer 2

您是否尝试过使用

$("#SlideMe1a").live('click', function() {
    $("#SlideMe1a").hide();
    $("#SlideMe1b").slideDown();

     });
 });

Answer 3

尝试删除style='display: none'

段落上的id='SlideMe1b'

第一个手风琴选项卡上的javascript工作

3 个答案: