锚标记在切换div中不起作用

时间:2017-03-03 11:36:43

标签: php jquery html css

为什么锚标签不起作用?我有两个div。当我点击第一个div时,显示第二个div,但是在第一个div锚标签中不起作用。

<script>
$('.description').hide();
$('.more').click(function(e){
    e.preventDefault();
    $(this).closest('.flight-row').find(".description").toggle();
});
</script>
<div id="trips">
    <div class="flight-row">
        <div class="flight-row-main more">
            <div><img src="view/images/user.png" alt="user.png" title="1 traveler" height="15" width="15"></div>
            <div class="button"><a href="index.php?act=travelerUserDetail&amp;flightTrainNumber=G8 208&amp;date=2017-01-30" class="btn btn-warning">Choose</a></div>
        </div>
        <div class="description">
            <div class="description-upper-div">
                <i class="fa fa-plane" aria-hidden="true"></i>
                <span>LKO<i class="fa fa-long-arrow-right" aria-hidden="true"></i>DEL</span>
                <span>2017-01-30</span>
            </div>
        </div>
    </div>
    <div class="flight-row"></div>
</div>

1 个答案:

答案 0 :(得分:0)

工作得很好。建议脚本应位于页面底部。

$('.description').hide();
$('.more').click(function(e){
    e.preventDefault();
    $(this).closest('.flight-row').find(".description").toggle();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="trips">
    <div class="flight-row">
        <div class="flight-row-main more">
            <div><img src="http://placehold.it/300x200.jpg" alt="user.png" title="1 traveler" height="15" width="15"></div>
            <div class="button"><a href="index.php?act=travelerUserDetail&amp;flightTrainNumber=G8 208&amp;date=2017-01-30" class="btn btn-warning">Choose</a></div>
        </div>
        <div class="description">
            <div class="description-upper-div">
                <i class="fa fa-plane" aria-hidden="true"></i>
                <span>LKO<i class="fa fa-long-arrow-right" aria-hidden="true"></i>DEL</span>
                <span>2017-01-30 </span>
            </div>
        </div>
    </div>
    <div class="flight-row"></div>
</div>