Question

这是HTML：

<html>
<head>
    <Script type = "text/javascript" src = "CprMdlrSrch.js"></Script>
    <link type="text/css"rel="stylesheet"href="CprMdlrSrch.css"/>
</head>
<body>
    <div id="main_box">
        <p id="instructions"><strong>Please enter a part number to search.</strong></p>
        <input id="part_num_search" type="text" name="searchPhrase">
         <button id="search_button" type="button" value="button"> <strong>Search</strong></button>
        <div id="results"></div>
<script type="text/javascript">
    </div>
</body>
</html>

这是Javascript：

$(document).ready(function(){ 
  $("#search_button").toggle(function() { 
    $("#part_num_search").fadeIn("slow");
  },
    $("#part_num_search").fadeOut("slow"); 
  });
});

我只是不确定我做错了什么。我真的只是想按下按钮以确保我走在正确的轨道上。

谢谢！ -Dustin

Answer 1

我不确定您是否了解如何使用toggle命令。请查看API文档：http://api.jquery.com/toggle/

对于淡入淡出切换，请尝试.fadeToggle（），它从JQuery 1.4.4开始变得可用。 http://api.jquery.com/fadeToggle/

尝试这样的事情：

$(document).ready(function(){ 
  $("#search_button").click(function() {
    $("#part_num_search").fadeToggle("slow");
  });
});

Answer 2

使用http://api.jquery.com/fadetoggle/可以更好地为您服务。

$("#search_button").click(function() { 
  $("#part_num_search").fadeToggle("slow");
});

按钮到Fadeout / in使用切换

2 个答案: