Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.01.2013, 18:39
Новичок на форуме
Отправить личное сообщение для nicknicknick Посмотреть профиль Найти все сообщения от nicknicknick
 
Регистрация: 22.01.2013
Сообщений: 3

Вопрос по аргументам функций, обрабатывающих события
Всем привет.
Есть страница с вопросами-ответами. Существует потребность скрывать (js-ом) ответы (replies) конкретной ветки, находящиеся в отдельном диве.

Вижу это так: первоначально на php генерируется html и проставляются аргументы, передаваемые в функцию.

<? 
$id = "'replies_113'"; //где 113 - главное сообщение ветки, вопрос.
print "div class='replies' id=".$id;
//... 
print "<a onclick='show_hide_thread_replies(".$id.")'">Скрыть/показать</a> "; 
//... 
?>


В результате получаем html:
<div id="thread_113">
   <!-- куча html кода -->
   <div class="replies" id="replies_113">
        <!-- куча html кода -->
        <a onclick="show_hide_thread_replies('replies_113')">Скрыть/показать</a>
   </div>
</div>
<div id="thread_116">
   <!-- куча html кода -->
   <div class="replies" id="replies_116">
        <!-- куча html кода -->
        <a onclick="show_hide_thread_replies('replies_116')">Скрыть/показать</a>
    </div>
</div>


И вызываемая функция:
function show_hide_thread_replies(id){
    var el = document.getElementById(id);
    el.style.display = (el.style.display == "none") ? "" : "none";
}


Вопрос: правильно ли так делать, где можно конкретно о такой практике почитать, если она имеет место быть?
Имеет ли смысл делать скрытый инпут со значением id вопроса, чтобы от него плясать?
Какие варианты еще есть?
Планируется AJAX.

Последний раз редактировалось nicknicknick, 22.01.2013 в 18:46.
Ответить с цитированием
  #2 (permalink)  
Старый 22.01.2013, 18:46
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

nicknicknick,
Удобнее пользоваться jQuery и скрывать ветку по классу(добавив класс) в ее начале (или нужном посте)
Тем паче, что "Планируется AJAX."
http://jquery-docs.ru/Selectors/class/#class
http://jquery-docs.ru/Attributes/hasClass/#class

(Хотя есть кроссбраузерная библиотека и на JS c поиском по селекторам)

Последний раз редактировалось Deff, 22.01.2013 в 18:49.
Ответить с цитированием
  #3 (permalink)  
Старый 22.01.2013, 18:52
Новичок на форуме
Отправить личное сообщение для nicknicknick Посмотреть профиль Найти все сообщения от nicknicknick
 
Регистрация: 22.01.2013
Сообщений: 3

jQuery использовать в ближайшем будущем не планируется.
Есть рабочая реализацию функции getElementsByClass(), с помощью нее отображаются/скрываются ответы всех веток. В данном случае - конкретной.

Если для каждой ветви генерировать свой класс, как быть с css?
Ответить с цитированием
  #4 (permalink)  
Старый 22.01.2013, 19:09
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,569

nicknicknick,

<head>
  <title></title>
  <meta charset="utf-8" />
<style type="text/css">
.replies {
  display: none;
}
</style>
<script type="text/javascript">
 function show_hide_thread_replies(id){
    var el = document.getElementById(id);
    el.style.display = (el.style.display != "block") ? "block" : "none";
}
</script>
</head>
<body>
<div id="thread_113">
   <!-- куча html кода -->
   <div class="replies" id="replies_113">123
        <!-- куча html кода -->

   </div>
   <a onclick="show_hide_thread_replies('replies_113')">Скрыть/показать</a>
</div>
<div id="thread_116">
   <!-- куча html кода -->
   <div class="replies" id="replies_116">456
        <!-- куча html кода -->

    </div>
   <a onclick="show_hide_thread_replies('replies_116')">Скрыть/показать</a>
</div>
</body>

</html>
Ответить с цитированием
  #5 (permalink)  
Старый 22.01.2013, 19:34
Новичок на форуме
Отправить личное сообщение для nicknicknick Посмотреть профиль Найти все сообщения от nicknicknick
 
Регистрация: 22.01.2013
Сообщений: 3

рони,
Спасибо, именно так я себе это представляю.
Вопрос, правда, был в другом.

Просто, как я понял можно сделать и так:
<a onclick="show_hide_thread_replies(this)">Скрыть/показать</a>

и потом идти по дереву к родительскому диву, только смущает меня этот метод.

А описанный мной выше кажется каким-то хлипким, ведь кроме как в id нигде информации о номере сообщения не имеем.
Нужен ли скрытый инпут?
Ответить с цитированием
  #6 (permalink)  
Старый 22.01.2013, 19:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,569

Сообщение от nicknicknick
Нужен ли скрытый инпут?
зачем если можно искать по классу
<!DOCTYPE HTML>
<html>
<head>
  <title></title>
  <meta charset="utf-8" />
<style type="text/css">
.replies {
  display: none;
}
</style>
<script type="text/javascript">
 function show_hide_thread_replies(el){
    var divs = el.parentNode.getElementsByTagName('div')
    for (var i=0; i<divs.length; i++)  {
      if(divs[i].className == "replies")  break
    }
    divs[i].style.display = (divs[i].style.display != "block") ? "block" : "none";
}
</script>
</head>
<body>
<div id="thread_113">
   <!-- куча html кода -->
   <div class="replies" id="replies_113">123
        <!-- куча html кода -->

   </div>
   <a onclick="show_hide_thread_replies(this)">Скрыть/показать</a>
</div>
<div id="thread_116">
   <!-- куча html кода -->
   <div class="replies" id="replies_116">456
        <!-- куча html кода -->

    </div>
   <a onclick="show_hide_thread_replies(this)">Скрыть/показать</a>
</div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
еще один вопрос про кнопки и события f0rzik Общие вопросы Javascript 15 19.01.2013 22:19
вопрос по jquery. Одновременно выполняющиеся события. как запретить одно? vuler Общие вопросы Javascript 5 23.03.2012 15:27
Вопрос по работе функций в PHP bayah Серверные языки и технологии 2 12.02.2011 17:42
Вопрос по создании функции для события com-meta jQuery 2 01.10.2010 14:59
Как отлаживать события? Или как сделать трассировку вызовов функций? gennad Events/DOM/Window 1 18.08.2010 13:21