Question

我试图让jquery将我的名字存储在一个变量中然后显示它在h3所在的位置。我还希望按钮在悬停时褪色。

<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='style.css'/>
<link rel='stylesheet' href='todo.css'/>
<script type='text/javascript' src='todo.js'></script>
</head>
<body>
<div>
<form><br>
    <h3 id="text">What Is Your Name?</h3><br><br>
    <input id="input" class="text" type="text" name="name" value="">
    <button id="next" class="submit" type="button">Next</button> 
</form>
</div>
</body>
</html>

Jquery也是

$(document).ready(function(){
$(".submit").mouseenter(function(){
   $(".submit").fadeTo('slow', 0.15);
});
$(".submit").click(function(){
  var input = $('#input').val();
  $('h3').text('Hello, ' + input + ". Let's get started.");
});
});

Answer 1

看起来您已经忘记包含jQuery，除非它在您的todo.js文件中。如果你这样做，它就可以正常工作。

示例 - Live Copy

<!DOCTYPE html>
<html>
<head>
  <!-- Include jQuery -->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<link rel='stylesheet' href='style.css'/>
<link rel='stylesheet' href='todo.css'/>
  <!-- This script stands in for your todo.js -->
  <script>
    $(document).ready(function(){
      $(".submit").mouseenter(function(){
        $(".submit").fadeTo('slow', 0.15);
      });
      $(".submit").click(function(){
        var input = $('#input').val();
        $('h3').text('Hello, ' + input + ". Let's get started.");
      });
    });

  </script>
</head>
<body>
<div>
<form><br>
    <h3 id="text">What Is Your Name?</h3><br><br>
    <input id="input" class="text" type="text" name="name" value="">
    <button id="next" class="submit" type="button">Next</button> 
</form>
</div>
</body>
</html>

我无法将HTML文本框导入Jquery

1 个答案: