Javascript.RU

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

Отображение скрытых блоков
Сейчас у меня такая задача.
В цикле крутятся даты с параметром $i,события с одинаковой датой заносятся каждый в свой блок по дате.И есть кнопки к этим блокам.Как их связать?Нужно открывать/закрывать по кнопке один блок с определенной датой, блоки должны сменять друг друга (Привер блоков на картинке).

Есть код, обрабатывающий кнопки:
Код Javascript
[JS]<script>
 
var toggle = function() {
  
    var currentDiv = null;

  
    function open(divElement) {
        
        divElement.style.display = "block";
        currentDiv = divElement;
    }

  
    function close(divElement) {
       
        divElement.style.display = "none";
        currentDiv = null;
    }

  
    return function(divID) {
        // Ïîëó÷àåì ýëåìåíò èç DOM
        var divElement = document.getElementById(divID);
   
        if (divElement) {
    
            if (divElement === currentDiv) {
                close(currentDiv);
           
            } else if(currentDiv != null) {
                close(currentDiv);
                open(divElement);
           
            } else open(divElement);
        }
    }
  
  }();
  

</script>
[/JS]


Есть кнопки:

if ($i == 1)
	{
    echo '<tr ><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('cont1');return false;" style="text-decoration:none"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';
    
    }
	else
		{
		if ($day_name == 0 or $day_name == 6){
    echo '<tr ><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" style="text-decoration:none"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';
    }
		else
    {
    echo '<tr ><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" style="text-decoration:none"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
   	  
		}



Значит кнопки вроде работают.Но есть несколько проблем:
1. Один блок я сделала видимым.И когда жму по другим кнопкам, он не закрывается.Ну закрывается только под своей кнопкой.А блоки должны меняться.С остальными кнопками нормально, только первая.Возможно потому,что вынесла ее в отдельный блок.Но как тогда задать ей display:block.
2. Под одной датой может быть несколько записей.Но везде открывается только одна.Вот.Почему?
Ответить с цитированием
  #2 (permalink)  
Старый 09.07.2010, 15:51
Новичок на форуме
Отправить личное сообщение для Perlovka_Nat Посмотреть профиль Найти все сообщения от Perlovka_Nat
 
Регистрация: 09.07.2010
Сообщений: 4

Догадалась почему отображается только одна запись.Дело в getElementById. У некоторых дивов получается один id, чем можно заменить getElementById?
Ответить с цитированием
  #3 (permalink)  
Старый 09.07.2010, 15:54
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

getElementsByClass
Ответить с цитированием
  #4 (permalink)  
Старый 09.07.2010, 15:55
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Perlovka_Nat,
Не использовать id а передавать сразу элемент
__________________
.
Ответить с цитированием
  #5 (permalink)  
Старый 26.07.2010, 15:37
Новичок на форуме
Отправить личное сообщение для Perlovka_Nat Посмотреть профиль Найти все сообщения от Perlovka_Nat
 
Регистрация: 09.07.2010
Сообщений: 4

О, это опять я.В целом все работает, как я хотела.
Но все же одна проблема так и осталась:
если все блоки закрыты изначально, то когда открываешь их они взаимозаменяются.Но если один блок открыт изначально, все щелкается как как надо,но этот блок открытый так и не закрывается.Т.е. получается уже 2 открытых блока.Меняла скрипт по всякому ничего не помогает.Яву плохо знаю, пыталась на пхп замутить, но как-то все криво работает.
Ответить с цитированием
  #6 (permalink)  
Старый 28.07.2010, 17:45
Профессор
Отправить личное сообщение для Маэстро Посмотреть профиль Найти все сообщения от Маэстро
 
Регистрация: 02.07.2010
Сообщений: 642

Не совсем понятно, почему у Вас везде стоит onClick="toggle('<? echo $day_sel?>'); и только в первом случае onClick="toggle('cont1');

Что такое 'cont1' и к чему он привязан?
Ответить с цитированием
  #7 (permalink)  
Старый 29.07.2010, 16:49
Новичок на форуме
Отправить личное сообщение для Perlovka_Nat Посмотреть профиль Найти все сообщения от Perlovka_Nat
 
Регистрация: 09.07.2010
Сообщений: 4

Это старая ошибка.просто я скрипт меняла по всякому.
Вот новый код
<script language="JavaScript" type="text/javascript">

 // Îáâîðà÷èâàåì ôóíêöèþ toggle â ëîêàëüíîå çàìûêàíèå:
var toggle = function() {
    // Ññûëêà íà òåêóùèé îòêðûòûé div:
    var currentDiv = null;

    // Ôóíêöèÿ äëÿ "ðàñêðûòèÿ" ýëåìåíòà:
    function open(divElement) {
        // Òóò ìîæíî äîáàâèòü ýôôåêò "ïëàâíîãî" îòêðûòèÿ:
        divElement.style.display = "block";
        currentDiv = divElement;
    }

    // Ôóíêöèÿ äëÿ "çàêðûòèÿ" ýëåìåíòà:
    function close(divElement) {
        // Òóò ìîæíî äîáàâèòü ýôôåêò "ïëàâíîãî" çàêðûòèÿ:
        divElement.style.display = "none";
        currentDiv = null;
    }

    // Âîçâðàùàåì ôóíêöèþ, êîòîðàÿ áóäåò âûçûâàòüñÿ ïî toggle()
    return function(divID) {
        // Ïîëó÷àåì ýëåìåíò èç DOM
        var divElement = document.getElementById(divID);
        // Åñëè îòêðûò äðóãîé div, òî çàêðûâàåì è îòêðûâàåì òåêóùèé:
            if(currentDiv != null) {
                close(currentDiv);
                open(divElement);
                }
        // Åñëè òàêîé åñòü:
      else  if (divElement) {
            // Åñëè óæå îòêðûò ýòîò div, òî ïðîñòî çàêðûâàåì.
            if (divElement === currentDiv) {
                close(currentDiv);
            // Åñëè îòêðûò äðóãîé div, òî çàêðûâàåì è îòêðûâàåì òåêóùèé:
            } else if(currentDiv != null) {
                close(currentDiv);
                open(divElement);

            // Èíà÷å - ïðîñòî îòêðûâàåì:
            } else open(divElement);

        }
    }
  // Âûçûâàåì íàøó "îáåðòêó", òåïåðü toggle() âûçûâàåò ôóíêöèþ, îïèñàííóþ ïî "return"
  }();


</script>


if ($i == 1)
	{

    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    //echo $day_sel;
    ?>
    
    <A href="javascript://" onClick="toggle('<? echo $day_sel; ?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';
    
    }
    elseif ($i == 2)
   
	{

    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel; ?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
	 elseif ($i == 3)
	{
    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
     elseif ($i == 4)
	{
    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.0'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
     elseif ($i == 5)
	{
    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.0'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
     elseif ($i == 6)
	{
    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    ?>
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.0'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
   else
	{
    echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
    //echo $day_sel;
    ?>
    
    <A href="javascript://" onClick="toggle('<? echo $day_sel?>');return false;" class="c"><div class="data1"><br><? echo $day_now.'.0'; echo $month_now; ?></div></a>
<?
    echo '</TD></tr>';

    }
Ответить с цитированием
  #8 (permalink)  
Старый 29.07.2010, 20:42
Профессор
Отправить личное сообщение для Маэстро Посмотреть профиль Найти все сообщения от Маэстро
 
Регистрация: 02.07.2010
Сообщений: 642

Желательно к скрипту дать читабельные комментарии, а не " Îáâîðà÷èâàåì ôóíêöèþ toggle â ëîêàëüíîå çàìûêàíèå:"
и показать не PHP-код, а HTML-результат. Есть действующая ссылка этой страницы?

по PHP-коду: Лучше не использовать конструкцию /if ... elseif/, а оператор switch() - так код прозрачнее.
но в Вашем случае, где проверяемый параметр $i - это последовательные цифры ещё лучше написать одну функцию, которая будет генерировать один блок HTML, например, что-то вроде такого:

function OneLine($i)
{
echo '<tr><TD width="39" height="39" nowrap align="center" valign="middle">';
echo '<A href="javascript://" onClick="toggle("'.$day_sel.'");return false;" class="c"><div class="data1"><br>'.$day_now.'.0'.$month_now'</div></a>
echo '</TD></tr>';
}

Кстати, я так и не понял, на что у Вас влияет праметр $i

Последний раз редактировалось Маэстро, 29.07.2010 в 20:59.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Прерывание события на границе двух блоков miller Events/DOM/Window 0 25.06.2010 20:58
Информация не передается из скрытых блоков rolph Общие вопросы Javascript 10 28.12.2009 16:45
Печать невидимых блоков mixeeff Events/DOM/Window 7 11.03.2009 11:41
Отображение активного содержания в IE maksik Internet Explorer 3 16.08.2008 19:56
Копирование блоков страницы(или целиком) Phoenix Общие вопросы Javascript 30 24.03.2008 23:46