CODEWITHSUNDEEP
javascripthtmlcsshidden
user1782677
user1782677

Reputation: 2007

have hidden text in HTML in java jsp file

So I have a java jsp file and inside it I want to use HTML in order to make it so a particular String/text is hidden until a button/link is pressed and then it shows up. How would i do this?

Javascript doesn't seem to be working. I tried the following but it didn't work:

<div style="display: none;" id="hiddenText">This is hidden</div>
<a href="#" onclick="document.getElementById('hiddenText').style.display="block"; return false;">Click here to see hidden text.</a>

Upvotes: 0

Views: 6006

Answers (3)

Kovge
Kovge

Reputation: 2019

The quotes was wrong, after block word

HTML:

 <div style="display: none;" id="hiddenText">This is hidden</div>
 <a href="#" onclick="return toggle('hiddentext');">Click here to see hidden text.</a>

 <script type="text/javascript">
    function toggle (id){
       var element = document.geElementById(id);
       if( 'none' == element.style.display ){
           element.style.display = 'block';

       }else{
           element.style.display = 'none';

       }
       return false;
    }
</script>

or if you use jQuery:

  <div style="display: none;" id="hiddenText">This is hidden</div>
  <a href="#" id="toggler">Click here to see hidden text.</a>

  <script tyle="text/javascript">
       $(function(){
            $('#toggler').click(function(e){
                e.preventDefault();
                $('#hiddenText').toggle();
            });
       });
  </script>

Upvotes: 1

Miguel Prz
Miguel Prz

Reputation: 13792

try this:

onclick="javascript://document.getElementById('hiddenText').style.display='block'; return false;"

Upvotes: 0

BackSlash
BackSlash

Reputation: 22243

Your double quotes are used as delimiters for the "onclick" attribute value, so if you want to style.display="block"; then you'll have to use single-quotes: style.display='block';

<div style="display: none;" id="hiddenText">This is hidden</div>
<a href="#" onclick="document.getElementById('hiddenText').style.display='block'; return false;">Click here to see hidden text.</a>

Hope this helps

Upvotes: 1

Related Questions