Question

我的javascript函数doit（）无法正常工作。我不知道为什么？有什么建议？我这里有java脚本代码但是如果需要查看html则可以更新。这是代码：这已被修改

       <!DOCTYPE HTML>
    <html>
    <head>
    <title>Something</title>
    <link rel="stylesheet" type="text/css" href="default.css">
    <script src="http://code.jquery.com/jquery-latest.js">
    </script>
    <script src="functions.js">
    </script>
    <script>
    $(document.body).ready(function () 
    {

        $("#video").slideDown("slow");
        $("#first").css("background-color","#CCC");


        $("#second").click( function () {
                $("#video").slideUp("slow",function() {
                    $("#first").css("background-color","#666");
                });
                $("#video2").slideDown("slow",function() {
                    $("#second").css("background-color","#CCC");
                }); 
        });



        $("#first").click(doit("first"));

    });
    function doit(x)
    {
        if(x.equals("first"))
        {
            $("#video2").slideUp("slow",function() {
                    $("#second").css("background-color","#666");
                });
                $("#video").slideDown("slow",function() {
                    $("#first").css("background-color","#CCC");
                }); 
        }
        else if(x == "second")
        {

        }
        else if(x == "third")
        {
        }
    }


    </script>
    </head>
    <body>
    <div id ="content">
        <div id="header"> 
            <h1>Picture</h1>
        </div>
        <span id="menu">
            <ul>
                <li id="first">Main Tab</li>
                <li id="second"> Video Tab</li>
                <li id="third">Third Tab</li>
                <li id="fourth">Fourth Tab</li>
            </ul>
        </span>
        <iframe id ="video" style="display:none" width="560" height="315"   src="http://www.youtube.com/embed/Sv6dMFF_yts" frameborder="0" allowfullscreen></iframe>

        <iframe id ="video2" style="display:none" width="560" height="315" src="http://www.youtube.com/embed/g16eL-_HlvI" frameborder="0" allowfullscreen></iframe>

        <div class="square" style="position:absolute; left: 1000px; top:500px;"></div>
        <div class="square" style="position:absolute; left: 1130px; top:500px;"></div>
        <div class="square" style="position:absolute; left: 1160px; top:500px;"></div>
        <div class="square" style="position:absolute; left: 1190px; top:500px;"></div>
        <div class="footer">2012
        </div>
    </div>
    </body>
    </html>

Answer 1

执行此操作时：

$("#first").click(doit("first"));

doit函数将立即执行（即执行该行时，而不是单击#first时），并且其返回值将附加到单击处理程序。在这种情况下，不会返回任何内容，因此单击它时没有任何反应。

你想要做的是：

$("#first").click(function(){
    doit("first");
});

此外，正如其他人所提到的，将if (x.equals("first"))交换为if (x == "first")

Answer 2

你在做if(x.equals("first")) 它应该是if(x == "first")

Answer 3

如果没有提及错误或您认为代码失败的地方，我不得不说这条线可能没有按照您的意愿行事：

if(x.equals("first"))

你可能希望这样：

if(x == "first")

您想要检查值的相等性，而不是对象引用的相等性。

Answer 4

据我所知，.equals()方法并不存在。你需要做这样的比较：

if(x === "first") {}

Here is a list of all methods available to String instances

任何人都可以弄清楚为什么我的jquery功能在我的第一个li标签上上下滑动不正常？

4 个答案: