Question

请问为什么地球上的功能不是我花了将近一个小时的时间：

这是jquery：

function toggleDivs() {
    var $inner = $("#inner");

    // See which <divs> should be animated in/out.
    if ($inner.position().left == 0) {
        $inner.animate({
            left: "-400px"
        });
    }
    else {
        $inner.animate({
            left: "0px"
        });
    }
}

$("button").bind("click", function() {
        alert("Hello");
    toggleDivs();
});

这是我的html中的头部

<head>
<script type="text/javascript" src="PageScript.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Lato:100,400' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="PageStyle.css">
</head>

Answer 1

你的头不正确。请将以下内容更改为此顺序：

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="PageScript.js"></script>
    <link href='http://fonts.googleapis.com/css?family=Lato:100,400' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="PageStyle.css">
</head>

Explination：

您的PageScript.js将首先在jquery.min.js之前加载，因此，您的PageScript.js中的所有jquery函数都将导致错误。

Answer 2

1）您的代码工作正常。

2）使用ready函数来使用绑定函数

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="PageScript.js"></script>
      <script>

    function toggleDivs() {
    alert('hi');
    } 
    $( document ).ready(function() {
    $("button").bind("click", function() {
            alert("Hello");
        toggleDivs();
    });
     });  
        </script>

Answer 3

尝试

$("button").on("click", function() {
        alert("Hello");
    toggleDivs();
});

如果其动态按钮使用事件委托

$(document).on("click",'button',function() {
        alert("Hello");
    toggleDivs();
});

脚本命令错误.Jquery必须首先，然后其他人

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="PageScript.js"></script>
    <link href='http://fonts.googleapis.com/css?family=Lato:100,400' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="PageStyle.css">
</head>

Jquery函数没被调用？

3 个答案: