Нужна помощь по Модальному окне js
<script> function toggle(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } function modal(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } </script> <ul> <li><a onclick="toggle(hidden_content)" href="#">Ответы<span class="activ">(+1)</span></a></li> </ul> <p onclick= "modal(mod_okno)" >Пробный текст</p> <div id="mod_okno" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> В случае если пропишу еще один раз второй код он не работает! Пример вот так этот код уже не работает: <script> function toggle(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } function modal(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } </script> <li><a onclick="toggle(hidden_content)" href="#">Ответы<span class="activ">(+1)</span></a></li> <p onclick= "modal(mod_okno)" >Пробный текст</p> <div id="mod_okno" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> <div id="mod_okno" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> |
ID должен быть уникальный!
а в втором варианте 1) <div id="mod_okno" style="display: none;"> 2) <div id="mod_okno" style="display: none;"> дважды используется id="mod_okno" используйте класы! <p onclick= "modal(document.getElementsByClassName('mod_okno_1')[0])" >Пробный текст 1</p> <div class="mod_okno_1" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> <p onclick= "modal(document.getElementsByClassName('mod_okno_2')[0])" >Пробный текст 2</p> <div class="mod_okno_2" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> <script> function toggle(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } function modal(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } </script> |
То для каждого окна который будет добавляться нужно еще писать другой class?
|
Цитата:
я на быструю руку написал через класы, можно и через ID, но если это ID - ОН ОБИЗАТЕЛЬНО ДОЛЖЕН БЫТЬ УНИКАЛЬНЫЙ <p onclick= "modal(mod_okno_1)" >Пробный текст 1</p> <div id="mod_okno_1" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> <p onclick= "modal(mod_okno_2)" >Пробный текст 2</p> <div id="mod_okno_2" style="display: none;"> <form> <textarea name="message"> </textarea> </form> </div> <script> function toggle(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } function modal(el) { el.style.display = (el.style.display == 'none') ? '' : 'none' } </script> |
Угу! Ну спасибо! Очень хорошо ты мне помог! Я уже весь день искал..! Спасибо еще раз!
Ну я дальше писать :write: А тебе + |
5 копеек про ID - обработка зависит от браузера. Некоторые браузеры в случае неуникальных ID берут первый попавшийся, а некоторые вообще посылают к рогатому вся и всех. Поэтому ID стоит лишний раз не использовать, если есть сомнения в его будущей уникальности...
|
Часовой пояс GMT +3, время: 15:26. |