Question

我第一次使用Javascript和jQuery而且我不知道自己做错了什么。我有一个家庭作业，给我.html文件，我添加了行。

这是我的.html

<!DOCTYPE html>
<html>
<head>
    <title>Jiggle Into JavaScript</title>
    <!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> -->
</head>
<body>

    <p>Press the buttons to change the box!</p>

    <div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>

    <button id="button1">Grow</button>
    <button id="button2">Blue</button>
    <button id="button3">Fade</button>
    <button id="button4">Reset</button>

    <script type="text/javascript" src="javascript.js"></script>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.mins.js"></script>
</body>

这是我的.js文件

function index(){

    var $box = $('#box');
$("#button1").click(function(){
    $("#box").animate({height: 300px});
});
   $("#button2").click(function(){
      $("#box").css("color", "blue");
 });
  $("#button3").click(function(){
       $("#box").fadeOut();
 });
 $("#button4").click(function(){
      $("box").end();
 });
 };
 $(document).ready(index);

Answer 1

function index(){

    var $box = $('#box');
$("#button1").click(function(){
    $("#box").animate({height: '300px'});
});
   $("#button2").click(function(){
      $("#box").css("background-color", "blue");
 });
  $("#button3").click(function(){
       $("#box").fadeOut();
 });
 $("#button4").click(function(){
      $("box").end();
 });
 };
 $(document).ready(index);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>

    <p>Press the buttons to change the box!</p>

    <div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>

    <button id="button1">Grow</button>
    <button id="button2">Blue</button>
    <button id="button3">Fade</button>
    <button id="button4">Reset</button>
</body>

你为高度提供字符串值，你需要用引号括起300px ，如果你试图改变背景颜色而不是使用backgroundColor或background-color属性，使用颜色改变文本的颜色。

这些是你已经犯过的一些常见错误，也考虑了“尖尖”给你的建议。

第一次使用Javascript和jQuery

1 个答案: