javascript - 如何使用jquery在按钮单击时显示表单？

Question

我希望当我单击“注册”按钮时显示我的表单

<div id="signup">
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>"  method="POST"  id="form1">
        <input name="user" type="text" placeholder="Username" size="30" >
        <input name="pass" type="password" placeholder="Password"  size="30" >
        <input class="btn" type="submit" value="sign up" name="signup">
</div>

这是 jQuery 代码:

<script>
$( "#form" ).click(function() {
  $( "#signup" ).show( "Clip", 1000 );
});
</script>

Answer 1

您可能想尝试这样的事情...(注意我在您的 HTML 中添加了一个额外的“按钮”并关闭了“form”标签

CSS...

#form1 {
 display : none;
}
button {
 margin-bottom: 10px;
}

HTML...

<div id="signup">
<button id="signup">Click here to sign-up!</button>
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>"  method="POST"  id="form1">
        <input name="user" type="text" placeholder="Username" size="30" >
        <input name="pass" type="password" placeholder="Password"  size="30" >
        <input class="btn" type="submit" value="sign up" name="signup">
    </form>
</div>

然后使用 JQuery...

$( document ).ready( function() {
  $( "#signup" ).click( function() {
    $( "#form1" ).toggle( 'slow' );
  });
});

JSFiddle

希望这有帮助。祝你好运!