Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Выпадающий список (https://javascript.ru/forum/dom-window/26031-vypadayushhijj-spisok.html)

مراد 23.02.2012 09:53

Выпадающий список
 
Добрый день. я тут хотел кое что написать на JS но не имею больших знаний(и возможностей их получить). Вы направите меня в нужное русло?
Поставил выпадающий список, только не знаю как его значения в скрипте использовать(как значение(value) присвоить переменной?).

Погода на:
<select id="SALAM" size="1" style="font-size: 12px;" onchange="update()">
<option value="1" selected="selected">день</option>
<option value="2">месяц</option>
<option value="3">год</option>
</select>&nbsp;


<script type="text/javascript">
var Ruz=$('Salam').value;
if (Ruz == 1)
{
document.write("salam");
}
else if (Ruz == 2)
{
documet.write("privet");
}
else
{
document.write("poka");
}


Вместо document.writе .... будут таблицы, но с этим я думаю сам разберусь.

Gozar 23.02.2012 11:39

Вот не пойму я - это жёсткий стёб такой? Ну да ладно.

Мурад.
во первых
id="SALAM"

значит и тут:
var Ruz=$('#SALAM').value;


JS регистрозависимый язык.

А вообще тебе сюда, кем бы ты ни был.

مراد 23.02.2012 21:00

Спасибос большое :)
 
Спасибо БОЛЬШОЕ:) :) :) :) :) :) :) :) . Щя посмотрю заработает или нет

مراد 23.02.2012 21:04

не работает же :(

مراد 23.02.2012 21:24

<html>
 <head>
 <title>Время намазов на</title>
 	<style>
	body, tr, form {font-family: tahoma; font-size: 12px; color: #404040; text-align: left; margin: 0; padding: 0}
	.header {background:#eef; border-bottom: 1px solid #ddd; padding: 7px;}
	</style>
 </head>
<body>
 <script type="text/javascript" src="../PrayTimes.js"></script>

 <div class="header">
 <form class="form" action="javascript:update();">
	Погода на: 
	<select id="SALAM" size="1" style="font-size: 12px;" onchange="update()">
		<option value="1" selected="selected">день</option>
		<option value="2">месяц</option>
		<option value="3">год</option>
    </select>&nbsp;
 </form>
 </div>
 
<script type="text/javascript">
var Ruz=$('SALAM').value;
if (Ruz == 1) 
{/*тут будет таблица*/
document.write('salam');
}
else if (Ruz == 2)
{/*тут будет таблица*/
documet.write("privet");
}
else
{/*тут будет таблица*/
document.write("poka");
}
</script>
</body>
</html>

مراد 23.02.2012 21:25

что он еще хочет от меня
 
<html>
 <head>
 <title>Время намазов на</title>
 	<style>
	body, tr, form {font-family: tahoma; font-size: 12px; color: #404040; text-align: left; margin: 0; padding: 0}
	.header {background:#eef; border-bottom: 1px solid #ddd; padding: 7px;}
	</style>
 </head>
<body>
 <script type="text/javascript" src="../PrayTimes.js"></script>

 <div class="header">
 <form class="form" action="javascript:update();">
	Погода на: 
	<select id="SALAM" size="1" style="font-size: 12px;" onchange="update()">
		<option value="1" selected="selected">день</option>
		<option value="2">месяц</option>
		<option value="3">год</option>
    </select>&nbsp;
 </form>
 </div>
 
<script type="text/javascript">
var Ruz=$('#SALAM').value;
if (Ruz == 1) 
{/*тут будет таблица*/
document.write('salam');
}
else if (Ruz == 2)
{/*тут будет таблица*/
documet.write("privet");
}
else
{/*тут будет таблица*/
document.write("poka");
}
</script>
</body>
</html>


что он еще хочет от меня?????:(

DreamTheater 23.02.2012 21:35

var Ruz = $('#SALAM').val();

Может так заработает?

Denizz 23.02.2012 22:05

А где вообще сама функция update() определена , которую вы по клику вызываете?

مراد 23.02.2012 23:34

Цитата:

Сообщение от Denizz (Сообщение 159501)
А где вообще сама функция update() определена , которую вы по клику вызываете?

Честно говоря я об этом нигде не читал:-? :-?

Gozar 24.02.2012 00:32

Цитата:

Сообщение от مراد (Сообщение 159487)
<html>
 <head>
 <title>Время намазов на</title>
	
 </head>
<body>
 <script type="text/javascript" src="../PrayTimes.js"></script>


что он еще хочет от меня?????:(

Может надо ещё и jquery подключить, раз ты пользуешь $-бакс
Цитата:

Сообщение от Gozar (Сообщение 159353)
var Ruz=$('#SALAM').value;

и не плохо бы было грузить это в head:

<script type="text/javascript" src="../PrayTimes.js"></script>

Где у тебя такая же строчка для jquery в head?

Denizz 24.02.2012 14:53

Вот мой вариант вашего "<script>" :
function update() {
var Ruz=document.getElementById("SALAM").value;
if (Ruz == 1)
{/*тут будет таблица*/
alert('salam');
}
else if (Ruz == 2)
{/*тут будет таблица*/
alert("privet");
}
else
{/*тут будет таблица*/
alert("poka");
}}

P.s.По обработчику событий нельзя вызывать "document.write" , так как полностью изменится содержание всего документы (он попросту удалится, останется только то, что задано в document.write).

مراد 24.02.2012 16:22

а вместо document.write таблица попрет?

مراد 24.02.2012 16:40

Цитата:

Сообщение от Gozar (Сообщение 159528)
Может надо ещё и jquery подключить, раз ты пользуешь $-бакс


и не плохо бы было грузить это в head:

<script type="text/javascript" src="../PrayTimes.js"></script>

Где у тебя такая же строчка для jquery в head?


:-? :-? :-? :-? :-? :-? :-? :-? :-? :) :) :) :) :) что?

Denizz 24.02.2012 23:13

Цитата:

Сообщение от مراد (Сообщение 159667)
а вместо document.write таблица попрет?

:yes: Попрет, но немного по другому маршруту:
1.создаете пустой <div id="myTable">
2.переменную var myTable=document.getElementById("myTable");
3.myTable.innerHTML="<table трата та та та ></table>"//пишете как для HTML
Это как бы простой вариант действий...

مراد 25.02.2012 16:51

Denizz
Спасибо большое огромное......:) :)

Gozar 26.02.2012 16:00

Цитата:

Сообщение от مراد (Сообщение 159674)
:-? :-? :-? :-? :-? :-? :-? :-? :-? :) :) :) :) :) что?

:) :-? :-/ :help: :( :yes: :p :cray: :lol: :thanks: :agree: :haha: :nono: :victory: ;) :blink: :D :stop: :write: :dance: :no: что?

مراد 26.02.2012 22:44

:) как вам сказать.... :lol: :) . Я же эту тему не догоняю))))))))))))))))

مراد 28.02.2012 22:31

Таблицы на одой странице .....
 
<!DOCTYPE html>
<html>
<head>
	<title> Время намазов на месяц </title>
	<style>
		body, tr, form {font-family: tahoma; font-size: 12px; color: #404040; text-align: center; margin: 0; padding: 0}
		pre {font-family: courier, serif, size: 10pt; margin: 0px 8px;}
		input {font-size: 12px;}
		.header {background:#eef; border-bottom: 1px solid #ddd; padding: 7px;}
		.caption {font-size: 20px; color: #d95722; text-align: center; width: 10em;}
		.arrow {font-weight: bold; text-decoration: none; color: #3D3D3D; }
		.arrow:hover {text-decoration: underline;}
		.command {font-weight: bold; text-decoration: none; color: #AAAAAA; }
		.command:hover {text-decoration: underline;}
		.timetable {border-width: 1px; border-style: outset; border-collapse: collapse; border-color: gray; margin: 0 auto;}
		.timetable td {border-width: 1px; border-spacing: 1px; padding: 1px; border-style: inset; border-color: #CCCCCC;}
		.head-row {color: black; background-color: #eef;}
		.today-row {background-color: #F8F7F4; color: black}
	</style>
</head>

<body>

<script type="text/javascript" src="../PrayTimes.js"></script>

<div class="header">
<form class="form" action="javascript:update();">
	Широта: <input type="text" value="42" id="Широта" size="2" onchange="update();" />&nbsp;
	Долгота: <input type="text" value="47" id="Долгота" size="2" onchange="update();" />&nbsp;
	Часовой пояс: <input type="text" value="+3" id="timezone" size="2" onchange="update();" />&nbsp;
	DST: 
	<select id="DST" size="1" style="font-size: 12px;" onchange="update()">
		<option value="auto">Auto</option>
		<option value="0">0</option>
		<option value="1" selected="selected">1</option>
    </select>&nbsp;
	Метод: 
	<select id="Method" size="1" style="font-size: 12px;" onchange="update()">
		<option value="MWL" selected="selected">Muslim World League (MWL)</option>
		<option value="ISNA">Islamic Society of North America (ISNA)</option>
		<option value="Egypt">Egyptian General Authority of Survey</option>
		<option value="Makkah">Umm al-Qura University, Makkah</option>
		<option value="Karachi">University of Islamic Sciences, Karachi</option>
		<option value="Jafari">Shia Ithna-Ashari (Jafari)</option>
		<option value="Tehran">Institute of Geophysics, University of Tehran</option>
    </select>
</form>
</div>
<br/>
<table align="center">
<tr>
	<td><a href="javascript:displayMonth(-1)" class="arrow">&lt;&lt;</a></td>
	<td id="table-title" class="caption"></td>
	<td><a href="javascript:displayMonth(+1)" class="arrow">&gt;&gt;</a></td>
</tr>
</table>

<br/>
<table id="timetable" class="timetable">
	<tbody></tbody>
</table>

<div align="center" style="margin-top: 7px">
	Источник: <a href="http://Tasavvuf.ru/" class="command">Tasavvuf.ru</a> |
	Формат времени: <a id="time-format" href="javascript:switchFormat(1)" title="Изменить формат" class="command"></a>
</div>
<br/>

<script type="text/javascript">

	var currentDate = new Date();
	var timeFormat = 1; 
	switchFormat(0);

	// display monthly timetable
	function displayMonth(offset) {
		var lat = $('Широта').value;
		var lng = $('Долгота').value;
		var timeZone = $('timezone').value;
		var DST = $('DST').value;
		var Method = $('Method').value;

		prayTimes.setMethod(Method);
		currentDate.setMonth(currentDate.getMonth()+ 1* offset);
		var month = currentDate.getMonth();
		var year = currentDate.getFullYear();
		var title = monthFullName(month)+ ' '+ year;
		$('table-title').innerHTML = title;
		makeTable(year, month, lat, lng, timeZone, DST);
	}

	// make monthly timetable
	function makeTable(year, month, lat, lng, timeZone, DST) {		
		var items = {day: 'День', fajr: 'Фаджр', sunrise: 'Восход', 
					dhuhr: 'Зухр', asr: 'Аср',// sunset: 'Sunset', 
					maghrib: 'Магриб', isha: 'Иша'};
				
		var tbody = document.createElement('tbody');
		tbody.appendChild(makeTableRow(items, items, 'head-row'));

		var date = new Date(year, month, 1);
		var endDate = new Date(year, month+ 1, 1);
		var format = timeFormat ? '24h' : '12hNs';

		while (date < endDate) {
			var times = prayTimes.getTimes(date, [lat, lng], timeZone, DST, format);
			times.day = date.getDate();
			var today = new Date(); 
			var isToday = (date.getMonth() == today.getMonth()) && (date.getDate() == today.getDate());
			var klass = isToday ? 'today-row' : '';
			tbody.appendChild(makeTableRow(times, items, klass));
			date.setDate(date.getDate()+ 1);  // next day
		}
		removeAllChild($('timetable'));
		$('timetable').appendChild(tbody);
	}

	// make a table row
	function makeTableRow(data, items, klass) {
		var row = document.createElement('tr');
		for (var i in items) {
			var cell = document.createElement('td');
			cell.innerHTML = data[i];
			cell.style.width = i=='Day' ? '2.5em' : '3.7em';
			row.appendChild(cell);
		}
		row.className = klass;
		return row;		
	}

	// remove all children of a node
	function removeAllChild(node) {
		if (node == undefined || node == null)
			return;

		while (node.firstChild)
			node.removeChild(node.firstChild);
	}

	// switch Формат времени
	function switchFormat(offset) {
		var formats = ['12-часовой', '24-часовой'];
		timeFormat = (timeFormat+ offset)% 2;
		$('time-format').innerHTML = formats[timeFormat];
		update();
	}

	// update table
	function update() {
		displayMonth(0);
	}

	// return month full name
	function monthFullName(month) {
		var monthName = new Array('Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь');
		return monthName[month];
	}

	function $(id) {
		return document.getElementById(id);
	}


</script>

</body>
</html>
вот такая байда у меня получилась с одной таблицей:write:

<!DOCTYPE html>
<html>
<head>
	<title> Время намаза на сегодня </title>
	<style>
		body, td, th {font-family: verdana; font-size: 12px; color: #404040;}
		#timetable {border-width: 1px; border-style: outset; border-collapse: collapse; border-color: gray; width: 9em;}
		#timetable td, #timetable th {border-width: 1px; border-spacing: 1px; padding: 2px 4px; border-style: inset; border-color: #CCCCCC;}
		#timetable th {color:black; text-align: center; font-weight: bold; background-color: #F8F7F4;}
	</style>
</head>

<body>

<script type="text/javascript" src="../PrayTimes.js"></script>

<br>
<p align="center">город<br> регион</br> страна</br><p>
<div align="center" id="table"></div>

<script type="text/javascript">
	
	var date = new Date(); // today
	var times = prayTimes.getTimes(date, [42, 47], +3);
	var list = ['Fajr', 'Sunrise', 'Dhuhr', 'Asr', 'Maghrib', 'Isha'];

	var html = '<table id="timetable">';
	html += '<tr><th colspan="2">'+ date.toLocaleDateString() + '</th></tr>';
	for(var i in list)	{
		html += '<tr><td>'+ list[i]+ '</td>';
		html += '<td>'+ times[list[i].toLowerCase()]+ '</td></tr>';
	}
	html += '</table>';
	document.getElementById('table').innerHTML = html;

</script>

</body>
</html>


а это вторая таблица.



НИКТО НЕ ЗНАЕТ КАК ПО IP АДРЕСУ ВЫЧИСЛИТЬ КООРДИНАТЫ ???????????

مراد 28.02.2012 22:39

у меня тоже чё мне сделали;)

Denizz 29.02.2012 22:46

Салам, Мурад. Напиши мне в ЛС подробно чего ты хочешь от скрипта, постараюсь помочь.


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