Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Простой динамический список (https://javascript.ru/forum/dom-window/37463-prostojj-dinamicheskijj-spisok.html)

1baddog1 25.06.2013 11:08

Привет, не силен в java. Подскажите плз, как сделать, чтобы третий вариант нормально работал, не могу разобраться. Помогите плз

<style>
.div2 {
 display: none ;
}
</style>
<style>
.div3 {
 display: none ;
}
</style>
<select onchange="change(this.value);">
<option value=1 selected>1 вариант</option>
<option value=2>2 вариант</option>
<option value=3>3 вариант</option>
</select>
<div class="div1"><input type="checkbox" value="Курс 1" />Курс 1<br /></div>
<div class="div1"><input type="checkbox" value="Курс 2" />Курс 2<br /></div>
<div class="div1"><input type="checkbox" value="Курс 3" />Курс 3<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 1" />нКурс 1<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 2" />нКурс 2<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 3" />нКурс 3<br /></div>
<div class="div3"><input type="checkbox" value="ннКурс 1" />ннКурс 1<br /></div>
<div class="div3"><input type="checkbox" value="ннКурс 2" />ннКурс 2<br /></div>
<script>
var divs = [document.querySelectorAll(".div1"), document.querySelectorAll(".div2"), document.querySelectorAll(".div3")] ;
function change(i) {
 i = i-1 ;
 var nodeList = divs[i] ;
 var l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "block" ;
 i = !i - 0 ;
 nodeList = divs[i] ;
 l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "none" ;
i = 1 - 0 ;
 nodeList = divs[i] ;
 l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "none" ;
} ;
</script>


в данном случае 1 и 3 вариант отрабатывает нормально. а когда выбираешь 2 то блоки 3 варианта накладываются на 2 вариант

skrudjmakdak 25.06.2013 11:23

а что у вас за выражение:
i = !i - 0; //так не делают. результатом будет булево значение
а потом вы это булево значение запихивайте в массив divs[i];
ктож так делает? в массив должно идти число, причем целое!!


и зачем писать: i = i-1; в самом начале, когда можно в самом option описать value с нуля:

<option value=0 selected>1 вариант</option>
<option value=1>2 вариант</option>
<option value=2>3 вариант</option>

рони 25.06.2013 11:29

1baddog1,
Вариант ...
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<style>
.div2 {
 display: none ;
}
</style>
<style>
.div3 {
 display: none ;
}
</style>
<select onchange="change(this.value);">
<option value=1 selected>1 вариант</option>
<option value=2>2 вариант</option>
<option value=3>3 вариант</option>
</select>
<div class="div1"><input type="checkbox" value="Курс 1" />Курс 1<br /></div>
<div class="div1"><input type="checkbox" value="Курс 2" />Курс 2<br /></div>
<div class="div1"><input type="checkbox" value="Курс 3" />Курс 3<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 1" />нКурс 1<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 2" />нКурс 2<br /></div>
<div class="div2"><input type="checkbox" value="нКурс 3" />нКурс 3<br /></div>
<div class="div3"><input type="checkbox" value="ннКурс 1" />ннКурс 1<br /></div>
<div class="div3"><input type="checkbox"value="ннКурс 2" />ннКурс 2<br /></div>
<script>
var divs = document.querySelectorAll(".div1, .div2, .div3") ;
function change(i) {
 var nodeList = divs,
 l = nodeList.length ;
 while(l--)
 nodeList[l].style.display = "none" ;
 nodeList = document.querySelectorAll(".div"+i) ;
 l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "block" ;
} ;
</script>

</body>

</html>

1baddog1 25.06.2013 11:35

Поставил с нуля. Но при таком варианте тоже не правильно работает. На блоки 1 варианта накладывается блоки 3 варианта.

<script>
var divs = [document.querySelectorAll(".div1"), document.querySelectorAll(".div2"), document.querySelectorAll(".div3")] ;
function change(i) {
 i = i - 0 ;
 var nodeList = divs[i] ;
 var l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "block" ;
 i = i - 1;
 nodeList = divs[i] ;
 l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "none" ;
} ;
</script>

1baddog1 25.06.2013 11:37

спасибо! Рони так идеально отрабатывает

1baddog1 26.06.2013 12:24

всё конечно теперь супер работает, ещё раз спасибо.

</style>
<select onchange="change(this.value);">
<option value=1 selected>1 вариант</option>
<option value=2>2 вариант</option>
<option value=3>3 вариант</option>
</select>


Подскажите плз(использую cms modx и eform),
мне надо сделать так
</style>
<select onchange="change(this.value);">
<option value=1 вариант selected>1 вариант</option>
<option value=2 вариант>2 вариант</option>
<option value=3 вариант>3 вариант</option>
</select>


чтобы в репорте отображался текст выбранного варианта. скрипт перестаёт работать, когда меняю значение в value.

рони 26.06.2013 12:56

Цитата:

Сообщение от 1baddog1
чтобы в репорте отображался текст выбранного варианта. скрипт перестаёт работать, когда меняю значение в value.

остаётся только догадыватся что такое репорт и как он у вас формируется --- могу только предположить. значение value если это не число лучше ставить в кавычки, особенно когда строка содержит пробелы.
<option value="2 вариант">2 вариант</option>
и для получения числа из строки http://javascript.ru/parseFloat
function change(i) { i = parseFloat(i);

1baddog1 26.06.2013 13:02

кусок репорта:
<li><b>отделение:</b> [+otdel+]</li>
<li><b>Ответы вопроса</b> [+newkursy+]</li>



сам скрипт сейчас такой:
<style>
.div2 {
 display: none ;
}
</style>
<style>
.div3 {
 display: none ;
}
</style>
<p><label>Вопрос?</label><br />
<p><label for="otdel">Выберите отделение</label><br />
<select id="otdel" name="otdel" onchange="change(this.value); ">
<option value="1">отделение м</option>
<option value="2">отделение б</option>
<option value="3">отделение в</option>
</select>
<div class="div1"><input type="checkbox" name="newkursy[]" value="Курс 1" />Курс 1<br /></div>
<div class="div1"><input type="checkbox" name="newkursy[]" value="Курс 2" />Курс 2<br /></div>
<div class="div1"><input type="checkbox" name="newkursy[]" value="Курс 3" />Курс 3<br /></div>
<div class="div2"><input type="checkbox" name="newkursy[]" value="нКурс 1" />нКурс 1<br /></div>
<div class="div2"><input type="checkbox" name="newkursy[]" value="нКурс 2" />нКурс 2<br /></div>
<div class="div2"><input type="checkbox" name="newkursy[]" value="нКурс 3" />нКурс 3<br /></div>
<div class="div3"><input type="checkbox" name="newkursy[]" value="ннКурс 1" />ннКурс 1<br /></div>
<div class="div3"><input type="checkbox" name="newkursy[]" value="ннКурс 2" />ннКурс 2<br /></div>
<script>
var divs = document.querySelectorAll(".div1, .div2, .div3") ;
function change(i) {
 var nodeList = divs,
 l = nodeList.length ;
 while(l--)
 nodeList[l].style.display = "none" ;
 nodeList = document.querySelectorAll(".div"+i) ;
 l = nodeList.length ;
 while(l--)
  nodeList[l].style.display = "block" ;
} ;
</script>


в репорте где [+otdel+] берется значение из value

и при формировании репорта в зависимости от выбранного варианта подставляется 1, 2 или 3

а если value прописать так:
<option value="отделение м">отделение м</option>
<option value="отделение б">отделение б</option>
<option value="отделение в">отделение в</option>


то снизу не появляется select

рони 26.06.2013 13:07

Цитата:

Сообщение от 1baddog1
выбранного варианта подставляется 1, 2 или 3

а что мешает подставить 1 +" вариант" и не менять в селекторе ничего

1baddog1 26.06.2013 13:12

тогда
« MODx Parse Error »

MODx encountered the following error while attempting to parse the requested resource:
« PHP Parse Error »

PHP error debug
Error: Invalid argument supplied for foreach()
Error type/ Nr.: Warning - 2
File: /home/site/html/assets/snippets/eform/eform.inc.php
Line: 851
Line 851 source: foreach ($attributes as $k => $v)

Parser timing
MySQL: 0,0003 s (1 Requests)
PHP: 0,0355 s
Total: 0,0357 s


Часовой пояс GMT +3, время: 14:00.