为什么javascript slidetoggle功能不能保持打开状态?

时间:2015-03-04 18:25:47

标签: javascript php jquery toggle

我在页面上有一个链接可以打开和关闭搜索表单。例如,您搜索Spring术语类,然后要搜索新术语并单击“开始新搜索”。链接工作得很好,切换就好......除了切换自动再次关闭。我无法弄清楚为什么会发生这种情况,我已经搜索了堆栈溢出网站,并且没有一个解决方案似乎有用(或者我可能仍然做错了什么)我们将非常感谢您给予我的任何帮助。 这是调用函数的部分

<div class="course-schedule-wrapper">
    <span <?= ($show_form) ? 'style="display:none;"' : null ?> class="toggle-search"><a href="#">Start a new schedule search</a></span>
    <div id="course-schedule-search" <?= ($show_form) ? null : 'style="display:none;"' ?>>
        <form name="form" method="post" action="/schedules/">
            <input type="hidden" name="search" value="1" />
            <table summary="Course schedule search options" id="course-schedule-form">
                <tbody>
                    <tr valign="top">
                        <td nowrap="nowrap">
                            <label for="area_id" class="label">Semester:</label>
                        </td>
                        <td>

                            <!--<input type="radio" name="semester" value="2014SP" id="S2014SP" checked="checked">
                            <label class="inline" for="S2014SP">Spring 2014</label>
                            <br />
-->                         <?
                            $sflag = FALSE;
                            $fflag = FALSE;
                            if ($_POST['semester'] == '2014SU'){
                                $sflag = "checked=checked";
                            } 

                            if ($_POST['semester'] == '2014FA'){
                                $fflag = "checked=checked";
                            }

                            if(!$sflag && !$fflag) {
                                $fflag = "checked=checked";
                            } 
                            ?>

                            <input type="radio" name="semester" value="2014FA" id="S2014FA" <?= $fflag; ?>>
                            <label class="inline" for="S2014FA">Fall 2014</label>
                            <br />
                            <input type="radio" name="semester" value="2015SP" id="S2015SP" <?= $sflag; ?>>
                            <label class="inline" for="S2014SU">Spring 2015</label>
                            <br />

                        </td>
                    </tr>
                    <tr valign="middle">
                        <td nowrap="nowrap">
                            <label for="text" class="label">Search for:</label>
                        </td>
                        <td>
                            <input type="text" name="text" id="text" size="60" value="<?= ( (isset($_POST['text']) ) ? $_POST['text'] : null )?>">
                            &nbsp;
                            <div class="formtext">in course ID, title, or instructor</div>
                        </td>
                    </tr>
                    <tr>
                        <td nowrap="nowrap">
                            <label for="area_id" class="label">Area of study:</label>
                        </td>
                        <td>
                            <select name="area_id" size="1" id="area_id">

                                <option value="-1">Any Area of Study</option>

                                <?php
                                    $query = "SELECT * FROM areas WHERE inactive=0 ORDER BY name";
                                    $result = db_query($query)->fetchAll();
                                ?>

                                <? foreach( $result as $area ): ?>
                                    <option <?= ( isset($_POST['area_id']) && $area->id == $_POST['area_id'] ) ?' selected="selected" ' : null ?> value="<?=$area->id?>"><?= $area->name ?></option>
                                <? endforeach; ?>

                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td nowrap="nowrap">
                            <label for="division_id" class="label">Division:</label>
                        </td>
                        <td>
                            <select name="division_id" size="1" id="division_id">

                                <option value="-1">Any Division</option>

                                <?php
                                    $query = "SELECT * FROM divisions ORDER BY name";
                                    $result = db_query($query)->fetchAll();
                                ?>

                                <? foreach( $result as $division ): ?>
                                    <option <?= ( isset($_POST['division_id']) && $division->id == $_POST['division_id'] ) ?' selected="selected" ' : null ?> value="<?= $division->id ?>"><?= $division->name ?></option>
                                <? endforeach; ?>

                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td nowrap="nowrap">
                            <label for="time1" class="label">Start time:</label>
                        </td>
                        <td>
                            <div class="formtext">from
                                <select name="time[0]" size="1" id="time1" onchange="document.form.online.checked=false;">
                                    <option value="" selected="selected">anytime</option>
                                    <option <?= (isset($_POST['time']) && '07:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="07:30">7:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '08:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="08:30">8:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '09:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="09:30">9:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '10:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="10:30">10:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '11:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="11:30">11:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '12:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="12:30">12:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '13:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="13:30">1:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '14:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="14:30">2:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '15:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="15:30">3:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '16:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="16:30">4:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '17:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="17:30">5:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '18:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="18:30">6:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '19:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="19:30">7:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '20:30' == $_POST['time'][0]) ? ' selected="selected" ' : null ?> value="20:30">8:30 PM</option>
                                </select>

                                <label for="time2">to</label>
                                <select name="time[1]" size="1" id="time2" onchange="document.form.online.checked=false;">
                                    <option value="" selected="selected">anytime</option>
                                    <option <?= (isset($_POST['time']) && '07:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="07:30">7:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '08:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="08:30">8:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '09:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="09:30">9:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '10:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="10:30">10:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '11:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="11:30">11:30 AM</option>
                                    <option <?= (isset($_POST['time']) && '12:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="12:30">12:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '13:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="13:30">1:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '14:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="14:30">2:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '15:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="15:30">3:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '16:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="16:30">4:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '17:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="17:30">5:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '18:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="18:30">6:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '19:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="19:30">7:30 PM</option>
                                    <option <?= (isset($_POST['time']) && '20:30' == $_POST['time'][1]) ? ' selected="selected" ' : null ?> value="20:30">8:30 PM</option>
                                </select>

                                (inclusive)
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td nowrap="nowrap">
                            <label for="duration" class="label">Duration:</label>
                        </td>
                        <td>
                            <select name="duration" size="1" id="duration" onchange="document.form.online.checked=false;">
                                <option value="-1" selected="selected">any duration</option>
                                <option <?= (isset($_POST['duration']) && '01:00' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="01:00">1 hour</option>
                                <option <?= (isset($_POST['duration']) && '01:30' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="01:30">1.5 hours</option>
                                <option <?= (isset($_POST['duration']) && '02:00' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="02:00">2 hours</option>
                                <option <?= (isset($_POST['duration']) && '02:30' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="02:30">2.5 hours</option>
                                <option <?= (isset($_POST['duration']) && '03:00' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="03:00">3 hours</option>
                                <option <?= (isset($_POST['duration']) && '03:30' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="03:30">3.5 hours</option>
                                <option <?= (isset($_POST['duration']) && '04:00' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="04:00">4 hours</option>
                                <option <?= (isset($_POST['duration']) && '04:30' == $_POST['duration']) ? ' selected="selected" ' : null ?> value="04:30">4.5 hours</option>
                            </select>

                            <select name="durcomp" size="1" id="durcomp" onchange="document.form.online.checked=false;">
                                <option value="less"  <?= (isset($_POST['durcomp']) && 'less' == $_POST['durcomp']) ? ' selected="selected" ' : null ?>>or less</option>
                                <option value="more"  <?= (isset($_POST['durcomp']) && 'more' == $_POST['durcomp']) ? ' selected="selected" ' : null ?>>or more</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td nowrap="nowrap" class="label">Days:</td>
                        <td>
                            <table summary="Days of the week">
                                <tbody>
                                    <tr>
                                        <td align="center"><label for="M" class="formtext">M</label></td>
                                        <td align="center"><label for="T" class="formtext">T</label></td>
                                        <td align="center"><label for="W" class="formtext">W</label></td>
                                        <td align="center"><label for="R" class="formtext">R</label></td>
                                        <td align="center"><label for="F" class="formtext">F</label></td>
                                        <td align="center"><label for="S" class="formtext">S</label></td>
                                    </tr>

                                    <tr valign="top">
                                        <td align="center">
                                            <input type="checkbox" name="M" id="M" <?=( isset($_POST['M']) && "ON" == $_POST['M'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="center">
                                            <input type="checkbox" name="T" id="T" <?=( isset($_POST['T']) && "ON" == $_POST['T'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="center">
                                            <input type="checkbox" name="W" id="W" <?=( isset($_POST['W']) && "ON" == $_POST['W'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="center">
                                            <input type="checkbox" name="R" id="R" <?=( isset($_POST['R']) && "ON" == $_POST['R'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="center">
                                            <input type="checkbox" name="F" id="F" <?=( isset($_POST['F']) && "ON" == $_POST['F'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="center">
                                            <input type="checkbox" name="S" id="S" <?=( isset($_POST['S']) && "ON" == $_POST['S'] ) ? ' checked="checked" ' : null ?> value="ON">
                                        </td>

                                        <td align="left">
                                            <select name="dayop" size="1" id="dayop">
                                                <option value="AND" <?=( isset($_POST['dayop']) && "AND" == $_POST['dayop'] ) ? ' selected="selected" ' : null ?>>these days only</option>
                                                <option value="OR" <?=( isset($_POST['dayop']) && "OR" == $_POST['dayop'] ) ? ' selected="selected" ' : null ?>>at least these days</option>
                                            </select>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>

                        </td>
                    </tr>
                    <tr valign="middle">
                        <td nowrap="nowrap"><label for="online" class="label">Show online<br>courses only:</label></td>
                        <?php 
                        if($_POST['online'] == "ON") {
                            $oflag = "checked=checked";
                        } 
                        ?>

                        <td><input type="checkbox" name="online" id="online" onclick="rst()" value="ON" <?= $oflag; ?>></td>
                    </tr>
                </tbody>
            </table>
            <input type="hidden" name="currentcourse" id="inprog" value="3">
            <br>
            <input type="submit"> | <input type="reset" value="Reset"><br>

        </form>

        <hr />

        <p class="body"><strong>To register</strong>, or for more information, contact
            the <a href="../ar/">Admissions office</a> at
            217.443.8800.
        </p>

        <p class="body">Some courses have flexible schedules or have schedules that are yet to be
            determined; these are listed as TBA (To Be Arranged) and include online
            (Internet) courses, video telecourses, internships, et cetera.  If you
            search based on time, length and/or day, the results will <b>not</b>
            include such courses.
        </p>

        <p class="body">Some courses involve a lab portion that meets at a different time and/or
            on different days than the lecture portion.  If you search based on time,
            length and/or day, the results may include the lecture portion or the lab
            portion, but not necessarily both, even though both portions are
            required.
        </p>
    </div>
</div>

这是功能信息(包括其他功能只是为了确保我没有遗漏任何东西)

jQuery(function($){

    $('#header-logo').click(function(){
        window.location = 'http://local.dannew.com/';
    });

    $(".course-schedule-wrapper .toggle-search a").click(function(e){
        e.preventDefault();
        $("#course-schedule-search").slideToggle();
    });

    $("#quicklinks").change(function(){
        if( $(this).val() != "0" )
            window.location = $(this).val();
    });

    $(".show-in-progress").click(function(){
        $('#inprog').val('1');
        $("form[name='form']").submit();
        console.log('test');
    });

    $("a").each(function(i, el){
        if( $(el).attr('href') == "/%23" || $(el).attr('href') == "..." ){
            $(el).click(function(){
                return false;
            }).css({
                "text-decoration" : "none",
                "color" : "#000",
                "cursor" : "default"
            });
        }
    });

2 个答案:

答案 0 :(得分:0)

该选择器的单击处理程序提交表单。提交表单将根据action网址代码中设置的条件重新加载新网页,除非该表单是通过ajax提交的。

加载新页面时没有保存页面状态。

因此,您基本上看到页面将自身重置为新版本

答案 1 :(得分:0)

我发现了我的问题,有一个无关的脚本副本

$(".course-schedule-wrapper .toggle-search a").click(function(e){
        e.preventDefault();
        $("#course-schedule-search").slideToggle();
    });

在其他一个提供给页面的文件中。删除该副本,现在它工作得很好!为了记录,这并不像这个“时间表”页面那么简单,开发人员创建了6个不同的文件来提供这一页!

相关问题