Insert form input value into href target URL with javascript

Question

I'm getting user input from a form and displaying this information in a span based on it's ID. How can I send this info to a tag as well? I want this to display their email and make an mailto: link with the same input.

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $("#email").keyup(update);
    });
    function update(){
    var email = $("#email").val();
    $('#DisplayEmail').html(email);
    }
    </script>

    <form>
        <input id="email" name="email" size="40" />
    </form>

    <a href="mailto:"><span id="DisplayEmail"></span></a>

Sal · Accepted Answer · 2012-01-30 22:41:52Z

3

Change this:

function update(){
   var email = $("#email").val();
   $('#DisplayEmail')
    .html(email)
    .parent().attr('href', 'mailto:'+email);
}

answered Jan 30, 2012 at 22:41

Sal

1,64512 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Flambino · Accepted Answer · 2012-01-30 22:51:15Z

1

Skip the span (it's unncessary, since the a can contain the address as well), and give the ID to the link instead

<script type="text/javascript">
    $(document).ready(function(){
        $("#email").keyup(function() {
            var email = $("#email").val();
            $('#DisplayEmail').text(email).attr("href", "mailto:" + email);
        });
    });
</script>

<form>
    <input id="email" name="email" size="40" />
</form>

<a id="DisplayEmail" href=""></a>

edited Jan 30, 2012 at 22:51

answered Jan 30, 2012 at 22:43

Flambino

18.9k2 gold badges44 silver badges59 bronze badges

Comments

user1119566 · Accepted Answer · 2012-01-30 22:44:00Z

0

function update(){
   var email = $("#email").val();
   $('#DisplayEmail')
    .html(email)
    .parent().attr('href', 'mailto:'+email);
}

answered Jan 30, 2012 at 22:44

user1119566

Collectives™ on Stack Overflow

Insert form input value into href target URL with javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related