Форум

rafaello · #1 (**permalink**) 13.01.2013, 17:34

Общий привет!
Прошу помочь в реализации простенького скрипта.
Есть выпадающий селект
<label>
<select name="count" id="tratata">
<option value="1">День Валентина</option>
<option value="2">Маме</option>
<option value="3">Ребенку</option>
<option value="4">На 8-е марта</option>
<option value="5">Свадебные</option>
</select></label>
и рядом есть ссылка вида
<a href="page<?php print $file;?>.html" onclick="return hs.htmlExpand(this, { objectType: 'iframe' } )">Выбрать</a>

Каким образом, не перезагружая страницы, при выборе определенного значения селекта, его значение (value ="3") подставлялось на место переменной $file
Например, если value ="3", то ссылка будет на page3.html

rafaello · #2 (**permalink**) 15.01.2013, 14:19

Хотя бы намек дали бы куда копать!!
Эх....

mullih · #3 (**permalink**) 15.01.2013, 14:26

вообщето на клиенте у вас уже не будет такой записи как

<a href="page<?php print $file;?>.html" onc...

а будет что-нибудь типо

<a href="page.html" onc...

ну а далее ловите событие на изменение значения и меняйте значение атрибута href элемента а на то что вам необходимо

Deff · #4 (**permalink**) 15.01.2013, 14:33

<form>
<select name="select" class="forminput" onchange="location.href=(form.select.options[form.select.selectedIndex].value)"> 
<option>Выбрать</option> 
<option value="http://javascript.ru/forum/">День Валентина</option>
 <option value="http://www.google.ru/search?">Маме</option>
 <option value="Ccылка">Ребенку</option>
 <option value="Ccылка">На 8-е марта</option>
 <option value="Ccылка">Свадебные</option>
</select> 
</form>

Вместо "Ccылка" - свою ссылку
Ну или так

<form>
<select name="select" class="forminput" onchange="location.href=(form.select.options[form.select.selectedIndex].value)"> 
<option>Выбрать</option> 
<option value="/page1.html">День Валентина</option>
 <option value="/page2.html">Маме</option>
 <option value="/page3.html">Ребенку</option>
 <option value="/page4.html">На 8-е марта</option>
 <option value="/page5.html">Свадебные</option>
</select> 
</form>

рони · #5 (**permalink**) 15.01.2013, 14:35

rafaello,

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
  <title></title>
</head>
<body>
<label>
<select name="count" id="tratata" >
 <option value="1">День Валентина</option>
 <option value="2">Маме</option>
 <option value="3">Ребенку</option>
 <option value="4">На 8-е марта</option>
 <option value="5">Свадебные</option>
 </select>
 </label>
и рядом есть ссылка вида
<a href="page1.html" onclick="return hs.htmlExpand(this, { objectType: 'iframe' } )">Выбрать</a>
<script type="text/javascript">
 var t = document.getElementById('tratata'),
 a = document.getElementsByTagName('a')[0];
 t.onchange = function () {a.href = "page"+this.value+".html"}
</script>
</body>
</html>

ksa · #6 (**permalink**) 15.01.2013, 14:37

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

Хотя бы намек дали бы куда копать

Как вариант, "первоначальный" УРЛ писать не в href, а какой-то другой атрибут...
ну а потом как mullih советовал "ловить", вычислять конечный УРЛ и "менять" значение у href.

mullih · #7 (**permalink**) 15.01.2013, 14:43

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

Как вариант, "первоначальный" УРЛ писать не в href, а какой-то другой атрибут...

в таком случае лучшего атрибута как data-href не придумаешь))

rafaello · #8 (**permalink**) 15.01.2013, 18:31

Друзья! Я безмерно счастлив! Отличный вариант у г-на профессора "рони". То что надо. Но, только он почему то работает на отдельно взятой странице. А если этот же код устанавливаю на страницу магазина (joomshopping)(там где это должно работать), то все - не пашет. Перепробовал разные варианты, и ссылку перекидывал с места на место, и добавлял еще разные ссылки, не пашет, ну ни как.
Самому то трудновато сочинить код, а вот по готовому прочитать уже можно. Вроде все правильно.
объявили переменную t
а потом a ,у которой тег <а> и первая по очереди
и создали событие

Но вот на основном сайте почему то не пашет.

рони · #9 (**permalink**) 15.01.2013, 18:37

rafaello,
скрипт поставьте после селекта и ссылки или
window.onload = function() {

//здесь код

}

rafaello · #10 (**permalink**) 15.01.2013, 19:05

что то никак.
и так

<script type="text/javascript">
 var t = document.getElementById('tratata'),
 a = document.getElementsByTagName('a')[0];
 t.onchange = function () {a.href = "page"+this.value+".html"}
	</script>

и вот так не пахает

<script type="text/javascript">
window.onload = function() {
 var t = document.getElementById('tratata'),
 a = document.getElementsByTagName('a')[0];
 t.onchange = function () {a.href = "page"+this.value+".html"}
}
	</script>

Форум

Справочник

Discord чат

Курсы javascript