Question

所以我有一个div ID，其中包含一个图像，该图像将作为切换点来展开和折叠位于其下方的结果ID的内容。

然而，我试图追随之前的“小提琴”，但我在实施项目时遇到了麻烦，我似乎无法让它发挥作用。图像显示但没有工作行为。控制台中也没有错误。：S

继承我的代码：

HTML：

<div class="container">
        <div id="result_location">
            <h3>name and results here</h3><img src="images/minus.png" alt="collapse content icon"></img>

        </div>    
        <div class="result_menu">
            <div id="film_column">
                <h4>('text')</h4>
            </div>    
            <div id="time_column">
                <h4>('text')</h4>
            </div>    
            <div id="genre_column">
                <h4>('text')</h4>
            </div>
               <div id="score_column">
                <h4>('text')</h4>
            </div>
        </div>
    </div>

CSS：

.container {

    border:0px;    
    width: 100%;
    }

    #result_location {

    color: white;
    text-align: center;   
    font-size: 0.8em;
    position: relative;
    text-transform: uppercase;       
    background: #2c3e50;    
    padding: 10px;             
    }
        img {

            height:0.5%;
            width: auto;
            padding: 0px;
        }

            #film_column, #time_column, #genre_column, #score_column {

             background: #ecf0f1;
             color: black;
             font-size: 1em;
             text-align: center;
             display: inline-block;
             position: absolute-relative;
             width:100%;
             margin-top: 0px;
             float: left;
             width: 100%;                 
            }

JS

$(".result_location").click(function(){
    $(toggle).next("#result_menu").slideToggle("slow");
})
.toggle( function() {
    $(toggle).children("img").attr("src","images/plus.png");
}, function() {
    $(toggle).children("img").attr("src","images/minus.png");
});

这是我试图复制的小提琴：http://jsfiddle.net/2UuW6/1/

Answer 1

试试吧，

$("#result_location").click(function(){
    $(this).next(".result_menu").slideToggle("slow");
    $img=$(this).find("img");
    $img.attr('src',
       $img[0].src=="images/plus.png"?"images/minus.png":"images/plus.png");  
});

Answer 2

小提琴似乎工作正常。但是，您需要检查项目中包含的jquery库。因为将jquery库更改为1.10.1会隐藏切换元素。

<强> Fiddle with 1.10.1 jq library

<script type="text/javascript" src="//code.jquery.com/jquery-1.10.1.js"></script>

class和image id元素在点击时不切换

2 个答案: