html выпадающий список вывод option value?

@arashvg · Регистрация: 08.07.2009

Студворк — интернет-сервис помощи студентам

есть выпадающий список

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<select name="country">
<option value="7122" selected="selected">Россия
</option>
<option value="7138">Украина
</option>
<option value="82300">Германия
</option>
<option value="4070">Израиль
</option>
<option value="4161">Казахстан
</option>
<option value="4161">Киргизия
</option>
<option value="1824">Латвия
</option>
<option value="1624">Литва
</option>
<option value="4161">Таджикистан
</option>
<option value="1206">Эстония
</option>
</select>
<br>

как в определённом месте страницы вывести значение

@Vanstorm · 24.01.2010, 21:32

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<select onchange="document.getElementById('id_1').innerHTML=this.options[this.selectedIndex].value;" name="country">
<option value="7122" selected="selected">Ðîññèÿ
</option>
<option value="7138">Óêðàèíà
</option>
<option value="82300">Ãåðìàíèÿ
</option>
<option value="4070">Èçðàèëü
</option>
<option value="4161">Êàçàõñòàí
</option>
<option value="4161">Êèðãèçèÿ
</option>
<option value="1824">Ëàòâèÿ
</option>
<option value="1624">Ëèòâà
</option>
<option value="4161">Òàäæèêèñòàí
</option>
<option value="1206">Ýñòîíèÿ
</option>
</select>
<br>
<div id="id_1">
</div>

@WerterWE · 02.08.2010, 16:44

Здравствуйте. Скажите, пожалуйста, а как сделать просто вывод значения, без <div>.
Что то мне подсказывает что надо изменить document.getElementById('id_1'), может я не прав?
А вообще очень бы хотелось узнать как это значение сразу присвоить элементу из javascript.

Vovan-VE · 02.08.2010, 16:57

Сообщение от WerterWE

а как сделать просто вывод значения, без <div>.

Вывод куда?

@homich77 · 02.08.2010, 17:58

Сообщение от Vanstorm

onchange="document.getElementById('id_1' ).innerHTML=this.options[this.selectedIndex].value;"

1.

JavaScript
1
onchange="alert(this.options[this.selectedIndex].value);"

- вывод во всплывающее окно
Не понятно, куда вам надо выводить?

Сообщение от WerterWE

значение сразу присвоить элементу из javascript.

2.

JavaScript
1
onchange="var cur = this.options[this.selectedIndex].value;"

- присвоение значения переменной cur. А после уже творите что вам надо )

Vovan-VE · 02.08.2010, 18:11

Сообщение от homich77

JavaScript
1
onchange="var cur = this.options[this.selectedIndex].value;"

homich77, Это создаст локальную переменную внутри обработчика onchange.

@WerterWE · 02.08.2010, 23:34

Сообщение от Vovan-VE

homich77, Это создаст локальную переменную внутри обработчика onchange.

О, спасибо, это уже хорошо, но в идеале нужно присвоение глобальной переменной.

А если все сначала:
у меня есть вот такой выпадающий список

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<form id="form1" name="form1" method="post" action="">
     <select name="select" id="select" 
     onChange="var cur = this.options[this.selectedIndex].value;">
         <script>  // показывает название файлов , среди которых есть .png
               document.write(  " <option value= '3232'  >3232</option>
<option value= '888'  >888</option>
<option value= 'litebox.css'  >litebox.css</option>
<option value= 'litebox.js'  >litebox.js</option>
<option value= 'php_book2.rar'  >php_book2.rar</option>
<option value= 'Untitled-1.php'  >Untitled-1.php</option>
<option value= 'vybor-gdz.png'  >vybor-gdz.png</option>
<option value= 'Алимов 7 класс.php'  >Алимов 7 класс.php</option>
<option value= 'проба 3 4 .txt'  >проба 3 4 .txt</option>"      )
                                         
        </script>

Нужно чтобы после выбора происходило бы присваивание значения value глобальной переменной допустим wer
А если будет выбран файл 'vybor-gdz.png' - то вывести этот рисунок на экран в виде :

JavaScript
1
document.write("<img src = 'http://localhost/444/"+ wer+ "'>");

@arvitaly · 03.08.2010, 00:27

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<form id="form1" name="form1" method="post" action="">
     <select name="select" id="select" 
         onChange="selectf();">
                 <script> 
var wer=null;
 // показывает название файлов , среди которых есть .png
                           document.write(  " <option value= '3232'  >3232</option>
<option value= '888'  >888</option>
<option value= 'litebox.css'  >litebox.css</option>
<option value= 'litebox.js'  >litebox.js</option>
<option value= 'php_book2.rar'  >php_book2.rar</option>
<option value= 'Untitled-1.php'  >Untitled-1.php</option>
<option value= 'vybor-gdz.png'  >vybor-gdz.png</option>
<option value= 'Алимов 7 класс.php'  >Алимов 7 класс.php</option>
<option value= 'проба 3 4 .txt'  >проба 3 4 .txt</option>"        )
                                     function selectf()
{
wer = this.options[this.selectedIndex].value;
if (wer=='ybor-gdz.png')
{
document.write("<img src = 'http://localhost/444/"+ wer+ "'>");
}
}                                            
                </script>

Только документ врайт лучше не использовать в таком случае

@WerterWE · 03.08.2010, 09:49

arvitaly, спасибо. А что использовать вместо document.write?
Еще раз спасибо, но все равно не желает выводится. Наверное необходимо более шире раскрыть вопрос, ну что постараюсь:
Будет это у меня типа меню.
Пользователь заходит на сайт и видит только одно выпадающее меню в котором отображены папки и файлы, допустим, с указанной мной папки "1".
Далее пользователь выбирает из выпадающего меню необходимый пункт. Если он выбрал файл (а конкретнее фото png или jpg) то он показывается на экране. А если выбирается папка - появляется рядышком второе выпадающее меню в котором уже осуществляется выбор из файлов выбранной пользователем папки. И снова если рисунок - то выводится, если папка - то следующее выпадающее меню.
Мне алгоритм ясен, но не как не могу получить value выбранного меню.
Привожу код который сделал:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
 
</head>
<body>
 // Узнаем имена в папке 1/ <br/> 
       <?    $dir = '1/'; // папка которую будем сканировать
              $data = opendir ($dir); // считываем содержимое папки $dir 
           while ($one = readdir ($data)) // собираем массив из результата сканирования
       { if($one != '.' && $one != '..') // если это содержимое дирректории
             { $files[] = $one; }
        }
       closedir ($data); // закрыть папку 
       print_r($files); //выводим массив с файлами и папками, вложенными в папку $dir.
    ?>
 <br/> // присваиваем значение внутренних переменной $files  глобальной переменной  в JS  qqq   <br/> 
       <SCRIPT >    // считываем размер массива с php и загоняем его а массив java  
    qqq = [ <?  $r = 0; 
              while ($r <= count($files))
                     {echo ( '" '.$files[$r] .' "'.' , ');   $r++;  }
         ?> ];
        document.write("<br/> "+  " это java вывод содержимого папки:   "+  qqq );
    </SCRIPT>
  <br/>  //вывод  выпадающего меню из списка папки 1  
 
<form id="form1" name="form1" method="post" action="">
  <select name="select" id="select" 
     onchange="selectf();">
      <script>  // прописывает необходимые строчки меню №1 в зависимости от количества файлов
        var wer=null;
               document.write(  " <?    $ww = 0; 
                                                                    while ( $ww <= count($files)-1) 
                        {echo ("<option value= '"  . $files[$ww]  .  "'  >".    
                                                                              $files[$ww] .  '</option>' );  $ww++;}
                         ?>" ); 
      function selectf() {    // присваивание переменной wer значения value
                                       var wer = this.options[this.selectedIndex].value;
                                        document.write(wer);   // вывод значения value, но ничего не выводит
                                         }                   
        </script>
     </select>
</body>
</html>

Дальше пойдет: если wer не равно "0", то идет вставка следующего выпадающего списка в зависимости от значения wer, в первом коде php будет

PHP
1
 $dir = '1/ + wer'; // папка которую будем сканировать

Тоже проблема как потом вставить в php значение wer из java, может таким же способом как выше: слиянием(попеременным) кодом php и JS

@arvitaly · 03.08.2010, 13:00

Ах да просто надо вот так

JavaScript
1
2
3
4
          function selectf(sel) {    // присваивание переменной wer значения value
                                       var wer = sel.options[sel.selectedIndex].value;
                                        document.write(wer);   // вывод значения value, но ничего не выводит
                                         }

HTML5
1
2
  <select name="select" id="select" 
     onchange="selectf(this);">

@WerterWE · 03.08.2010, 13:10

arvitaly, поменял как ты написал. В итоге переменную wer выводит абсолютно на новой пустой странице. Скажи, пожалуйста, как сделать так чтобы значение wer выводилось на этой же странице.

@arvitaly · 03.08.2010, 13:12

Лучше сделать div, разместить его там где нужно и менять его innerHTML

HTML5
1
document.getElementById("div_").innertHTML=wer;

как то так

@WerterWE · 03.08.2010, 13:19

Немного не понял куда это вставлять...

@arvitaly · 03.08.2010, 13:22

Вместо документ врайт, а див разместить там где нужно

@WerterWE · 03.08.2010, 14:55

Как говорится, какой вопрос такой ответ. Поэтому решил очень подробно рассказать, что в итоге очень хочется получить, и как я это делаю:
В итоге хочется получить вот такое выпадающее меню как здесь : [ссылка удалена, обычные связанные динамические select'ы на AJAX'е, все видели]
Что я делаю:
1) Узнаем имена в папке 1/

PHP
1
2
3
4
5
6
7
8
9
<? $dir = '1/'; // папка которую будем сканировать
       $data = opendir ($dir); // считываем содержимое папки $dir 
       while ($one = readdir ($data)) // собираем массив из результата сканирования
         { if($one != '.' && $one != '..') // если это содержимое дирректории
             { $files[] = $one; }
             }
        closedir ($data); // закрыть папку 
        print_r($files); //выводим массив с файлами и папками, вложенными в папку $dir.
    ?>

На будущее думаю можно это все вставить в JS или в function JS, чтобы можно было легче добавлять следующие выпадающие меню. Но может я не прав.

2) присваиваем значение переменной PHP: $files глобальной переменной в JS: qqq

JavaScript
1
2
3
4
5
6
7
<SCRIPT >     // считываем размер массива с php и загоняем его а массив java  
    qqq = [ <?  $r = 0; 
                while ($r <= count($files))
                    {echo ( '" '.$files[$r] .' "'.' , ');   $r++;   }
            ?>  ];
            document.write("<br/> "+  " ---это java2 вывод содержимого папки:   "+  qqq );
    </SCRIPT>

3) вывод выпадающего меню из списка папки 1

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<form id="form1" name="form1" method="post" action="">
  <select name="select" id="select" 
     onchange="selectf(this);">
       <script>  // прописывает необходимые строчки меню №1 в зависимости от количества файлов
        var wer=null;
           document.write(  " <?  
                                $ww = 0;    
                                while ( $ww <= count($files)-1) 
                                        {echo ("<option value= '"  . $files[$ww]  .  "'  >".    $files[$ww]     .  '</option>' );  $ww++;   }
                             ?>" );
            function selectf(sel) {    // присваивание переменной wer значения value
                                   wer = sel.options[sel.selectedIndex].value;
                                   document.getElementById("div_").innertHTML=wer;   
                                    return wer;  // ставлю вернуть значение, что бы можно было бы взять значение sel в любом месте JS, но ничего не возращает 
                                    }  ;
        </script>
    </select>
</form>

но ничего не пишет

4) Присвоить value выбранного файла переменной PHP: wer

arvitaly, попробовал то что ты посоветовал и сделал так
в JS поставил так

JavaScript
1
2
3
4
5
function selectf(sel) {    // присваивание переменной wer значения value
                                   wer = sel.options[sel.selectedIndex].value;
                                   document.getElementById("div_").innertHTML=wer;   
                                    return wer;  // ставлю вернуть значение, что бы можно было бы взять значение sel в любом месте JS, но ничего не возращает 
                                    }  ;

а в html так

HTML5
1
<p id= 'div_' >  </p>

5) Узнать расширение выбранного файла - есть предложение сделать это так:

а) присвоить значение выбранного файла, т.е. wer какой нибудь перемененной php, например, $jjj
б) прописать так: $obr = substr(strrchr($jjj, '.'), 1); - произойдет обрезание файла и в итоге получим расширение файла
в) Передать значение $obr глобальной переменной JS: obrjs

6) Сделать оператор if: если obrjs = "png" или "jpg" тогда document.write("<img src = 'http://localhost/444/1/"+ wer+ "'>");
иначе напечатать еще одно выпадающее меню: только вместо
$dir = '1/'; // папка которую будем сканировать
нужно
$dir = '1/+ wer';
Я не прошу всем кинуться и делать мне это, но если кто знает как реализовать правильно тот или иной пункт очень прошу подскажите, уже неделю мучаюсь, благо вспомнил про этот форум. Всем заранее спасибо.

Новые блоги и статьи Все статьи Все блоги /
Видеокарта простаивает ночами? Вот 4 проекта, которые загрузят её наукой Programma_Boinc 10.04.2026 Видеокарта простаивает ночами? Вот 4 проекта, которые загрузят её наукой Если на Windows стоит дискретная NVIDIA или AMD — можно отдать её вычислительную мощность реальным исследованиям. . . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .
Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .	Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .

@WerterWE 0 / 0 / 0 Регистрация: 03.05.2010 Сообщений: 20
	02.08.2010, 16:44
	Здравствуйте. Скажите, пожалуйста, а как сделать просто вывод значения, без <div>. Что то мне подсказывает что надо изменить document.getElementById('id_1'), может я не прав? А вообще очень бы хотелось узнать как это значение сразу присвоить элементу из javascript. 0

@WerterWE 0 / 0 / 0 Регистрация: 03.05.2010 Сообщений: 20
	03.08.2010, 13:10
	arvitaly, поменял как ты написал. В итоге переменную wer выводит абсолютно на новой пустой странице. Скажи, пожалуйста, как сделать так чтобы значение wer выводилось на этой же странице. 0

@WerterWE 0 / 0 / 0 Регистрация: 03.05.2010 Сообщений: 20
	03.08.2010, 13:19
	Немного не понял куда это вставлять... 0

@arvitaly Благотворец 142 / 122 / 13 Регистрация: 29.04.2009 Сообщений: 537
	03.08.2010, 13:22
	Вместо документ врайт, а див разместить там где нужно 0