Javascript function difficulty

Question

I am new to Javascript and am having some difficulty. I want to have the user type in a word and have a function identify the word and print it back to the user on the same page. Everytime I run this code though it takes me to a DIFFERENT page AND prints '[object]'. Here is my code. Can someone please help me.

Live Long and Prosper.

<html>
<head>
<script src="raphael-min.js"></script>
<script src="jquery-1.7.2.js"></script>

<script type="text/javascript">
function animate() {
var txt = document.getElementById("words");
document.write(txt);
}
</script>
</head>
<body>

Text: <input type="text" id="words" value="" />
<input type="submit" value="Animate" onclick="animate()" />

</body>

</html>

Clyde Lobo · Accepted Answer · 2013-07-25 09:25:51Z

3

Add a div to your page

<div id='msg'></div>

and change your js function to

 <script type="text/javascript">
    function animate() {
    var txt = document.getElementById("words").value;
    document.getElementById("msg").innerHTML = txt;
    return false;
    }
    </script>

Also make the following change to your submit button

<input type="submit" value="Animate" onclick="return animate()" />

edited Jul 25, 2013 at 9:25

answered Jun 29, 2012 at 15:53

Clyde Lobo

9,1747 gold badges37 silver badges63 bronze badges

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

3 Comments

John Doe Over a year ago

haha patience clyde. I have one last question and you will recieve your accepted answer. --What is the purpose of 'return false;'? Thanks, Spock

Clyde Lobo Over a year ago

@user1460876 : That was just a suggestion :P

Clyde Lobo Over a year ago

return false when used with the submit button prevents your form from submitting. I used it coz i thought you have a form. Not relevant in your case.

freakish · Accepted Answer · 2012-06-29 15:51:50Z

0

This code:

var txt = document.getElementById("words");

gives you an input, i.e. DOM object (which is represented by [object] when turned to string). And you want to retrieve its content, i.e. value. Try this:

var txt = document.getElementById("words").value;

Refreshing is caused by the submit button. Change its type to type="button".

answered Jun 29, 2012 at 15:51

freakish

57k12 gold badges141 silver badges181 bronze badges

Comments

toske · Accepted Answer · 2012-06-29 15:53:01Z

0

Instead of

    function animate() {
       var txt = document.getElementById("words");
       document.write(txt);
   }

try with

   function animate() {
       var txt = document.getElementById("words").value;
       document.write(txt);
   }

answered Jun 29, 2012 at 15:53

toske

1,75413 silver badges24 bronze badges

Collectives™ on Stack Overflow

Javascript function difficulty

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related