2013-03-10 1 views
0

Итак, у меня есть java-файл jsp, и внутри него я хочу использовать HTML, чтобы сделать его таким, чтобы конкретный String/text был скрыт до нажатия кнопки/ссылки, а затем появляется. Как мне это сделать?скрытый текст в HTML в java jsp файле

Javascript не работает. Я попытался следующие, но это не сработало:

<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> 

ответ

1

Кавычки не так, после того, как блок слова

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> 

или если вы используете 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> 
+0

Это сделало работу! Благодаря! Тем не менее, ссылка по-прежнему отображается под отображаемым текстом. есть ли способ сделать это, как только текст будет отображаться (или сделать так, чтобы щелкнуть его несколько раз, чтобы текст появлялся/исчезал? – user1782677

+0

Я изменил код, чтобы работать со ссылкой как toggler – Kovge

1

Ваши двойные кавычки используются как разделители для «OnClick» значение атрибута, так что если вы хотите style.display="block";, то вы должны будете использовать одинарные кавычки: 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> 

Надеется, что это помогает

0

попробовать это:

onclick="javascript://document.getElementById('hiddenText').style.display='block'; return false;" 
Смежные вопросы