Page 1 of 1

Problem With JavaScript

Posted: Tue Nov 18, 2008 8:20 pm
by ~ Zymus ~
Hello,

I am trying to get "test" to print on the screen whenever you click a button. Like so:

Code: Select all

<html>
    <head>
        <title>Test</title>
        
        <script language="javascript">
            <!--
                function Test()
                    {
                        document.write("Test");
                    }
            //-->
        </script>
    </head>
    
    <body>
        <?php
            print('<form method="post">');
            print('<input type ="button" value="Test" onclick="Test()"');
            print('</form>');
        ?>
    </body>
</html>
 
Now, if i were to just replace the body with this:

Code: Select all

<?php
    print('<script language="javascript">Test();</script>');
?>
 
It would write "Test" to the screen like i want it to. But whenever i use the first code, whenever i click the button, the entire page goes white. And nothing shows up. What am i doing wrong?

Re: Problem With JavaScript

Posted: Tue Nov 18, 2008 8:46 pm
by Eran
You forgot to close the input tag:

Code: Select all

 
print('<input type="button" value="Test" onclick="Test();" />');
 

Re: Problem With JavaScript

Posted: Wed Nov 19, 2008 12:14 am
by ~ Zymus ~
Nope, still get the same error:

Code: Select all

<html>
    <head>
        <title>Test</title>
        
        <script language="javascript">
            <!--
                function Test()
                    {
                        document.write("test");
                    }
            //-->
        </script>
    </head>
    
    <body>
        <?php
            print('<form>');
                print('<input type="button" value="Test" onclick="Test()"/>');
            print('</form>');
        ?>
    </body>
</html>
 
Is there anything wrong with the code itself? or could it just be my browser?

Ok, i think im wording it wrong. How would i inject/append text to a page after it's loaded?

Re: Problem With JavaScript

Posted: Wed Nov 19, 2008 2:35 am
by Eran
Don't use document.write, use .innerHTML -

Code: Select all

 
<html>
    <head>
        <title>Test</title>
       
        <script language="text/javascript">
            function Test(){
                document.getElementsByTagName('body')[0].innerHTML = 'test';
            }
        </script>
    </head>
   
    <body>
    
        <form method="post">
            <input type ="button" value="Test" onclick="Test();" />
        </form>
        
    </body>
</html>
 

Re: Problem With JavaScript

Posted: Thu Nov 20, 2008 2:47 pm
by JAB Creations
Don't use innerHTML either. :P

I took the time to put this together so hopefully you guys can learn from the example I have posted here...
http://www.jabcreations.com/web/javascript/elements.php

Re: Problem With JavaScript

Posted: Thu Nov 20, 2008 6:12 pm
by Eran
innerHTML is much more performant than DOM methods - http://www.quirksmode.org/dom/innerhtml.html

Also, if you want to use abstaction for DOM methods, use a good library like jQuery instead of rolling your own