CODEWITHSUNDEEP
jqueryhide
Ankur
Ankur

Reputation: 51118

jQuery hide problem

I can't seem to make the "tohide" element hide and thus toggling doesn't work either. Dreamweaver tells me that my error is this line }); which appears under the line $("#mydiv").toggle();

<html>
 <title>Hider</title>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/>
 <script type="text/javascript">
   $(document).ready(function(){
     $('#tohide').hide();
     $("#click").click(function() {
       $("#tohide").toggle();
     })
   });;
 </script>
 </head>
 <body>
   <input type="submit" name="click" id="click" value="Submit" />
   <table id="tohide" width="100">
     <tr>
       <td bgcolor="#00FF33"><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>
       </td>
     </tr>
   </table>
 </body>
</html>

Upvotes: 0

Views: 740

Answers (3)

Herr
Herr

Reputation: 2725

this is the corrected markup.

<html>
<head>
    <title>Hider</title>
</head>
<body>

    <a href="#" id="link_1">TOGGLE</a>

    <div id="some_id">

        <h1>HELLO</h1>

    </div>


<script src="jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">


    $(document).ready(function() {


        $("#link_1").click(function() {

            $("#some_id").toggle();
            // Act on the event
        });


    });


</script>


</body>

Please note that you also had a error in the calling of the script from google.
It is better to load it locally.

Have a nice day :)

Upvotes: 0

Darin Dimitrov
Darin Dimitrov

Reputation: 1039488

Instead of:

<script type="text/javascript" 
  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/>

Try:

<script type="text/javascript" 
  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Here's the reason why.

Also in the markup you posted there's no element with id="mybutton" nor id="mydiv".

Upvotes: 1

Alastair Pitts
Alastair Pitts

Reputation: 19601

try changing your jquery script import tag to include the </script> end tag.

from:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/>

to:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Upvotes: 2

Related Questions