show form field on clicking a link with javascript/jquery_问答_开发者

show form field on clicking a link with javascript/jquery

开发者 https://www.devze.com 2023-02-03 11:30 出处：网络

How can I show a form field by clicki开发者_StackOverflow社区ng a link , i want to show the field (with jquery/javascript) on samee place of link, so that link disappears and form box appears? Thanks.

Hey, here's a simple example:

CSS:

.myclassname .form{display:none;}

HTML:

<div class="myclassname">
   <a href="#" class="mylink">Link</a>
   <div class="form">
      <input type="text" value="" name="myinput" id="myinput"/>
   </div>
</div>

jQuery:

$(function(){
   $('.myclassname .mylink').click(function(){
      $(this).hide();
      $('.myclassname .form').show();
      return false;
   });
});

Cheers

Here is the simple code by using HTML and JavaScript.

<body>
<a href="#" id="mylink" onclick="myfunction();">MY</a>
<div id="myform" style="display:none">
    <form>
        <label>Name</label>
        <input type="text">
        <input type="submit">
    </form>
 </div>
<script>
    function myfunction(){
    document.getElementById("myform").style.display = "block";
    document.getElementById("mylink").style.display = "none";
    }
</script>
</body>

Thank's

Put the link in a div-element. On clicking the link, empty the div and append the form box.