1

我正在学习 JQuery 并理解我在下面编写的代码，因为它运行良好。对我来说这很简单，但似乎有点混乱。有没有更简单的方法来速记或组合功能来完成相同的结果。这是在单击图像时显示和隐藏不同的 DIV。

<script type="text/javascript">

$(document).ready(function(){ 

    $('#leftcolumn').hide();
    $('#2d').hide();
    $('#development').hide();
    $("#HideFlash").click(function () {
        $('#movie').toggle("slow");
        $('#leftcolumn').toggle('slow');
            return false;

        })
    });

    $('#leftcolumn').toggle('slow');


    $(document).ready(function () {
    $(".img1").click(function () {
        $('#2d').toggle("slow");
            return false;

    })
});

    $(document).ready(function () {
    $(".img2").click(function () {
        $('#development').toggle("slow");
            return false;

    })
});
</script>

HTML

<div id="container">


<div id="body" align="center">
<a id="HideFlash" href="#">hide video</a>
<div id="movie">

flash object movie here

</div>  
</div>


<div id="leftcolumn"> 
    <h1>Stephen Carl Willis:<br> 
    Web Developer/Designer</h1> 
    <ul>
    <li><img src="<?php echo base_url();?>/assets/images/close.png" alt="2d" class="img1">2D</></li>
    <li><img src="<?php echo base_url();?>/assets/images/close.png" alt="2d" class="img2">Development</></li>
    </ul>
    </div>


<div id="2d">
Here is my 2D graphic design. This includes vector, flash, ect.
</div>
<div id="development">
Here is my development portfolio.
</div>

4

1 回答 1

0

人们使用 jsfiddle.net 之类的工具来发布问题或解决方案的示例。这是你在小提琴中整理后的样子：http: //jsfiddle.net/rJ8XR/

$(document).ready(function(){  
    $('#leftcolumn').hide();
    $('#2d').hide();
    $('#development').hide();
    $("#HideFlash").click(function () {
        $('#movie').toggle("slow");
        $('#leftcolumn').toggle('slow');
        return false;
    })
    $('#leftcolumn').toggle('slow');

    $(".img1").click(function () {
        $('#2d').toggle("slow");
        return false;

    })
    $(".img2").click(function () {
        $('#development').toggle("slow");
        return false;
    });
});

...删除了额外的$(document).ready()处理程序，并清理了一些 html

于 2013-07-15T01:33:45.663 回答