Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > ссылка-рисунок INPUT type="image"

Автор: ОнКофе 5.7.2006, 18:51

Есть список

Код


<FORM name="form1">
<SELECT NAME="Sel1">
<OPTION VALUE="01">ссылка 1
<OPTION VALUE="02">ссылка 2
</SELECT><br>
<INPUT type="image" src="/images/images.gif"></FORM>

Как можно сделать чтобы при выборе из списка "ссылка 1" и нажитии на рисунок-кнопку откырвалась одна ссылка, а при выборе "ссылка 2" и нажатии на рисунок-кнопку открывалась другая ссылка???

Автор: skyboy 5.7.2006, 19:20

в функции-обработчике onclick для кнопки-рисунка делай проверку:

Код


if (True==document.Sell.options[0].selected)
<переходим по первой ссылке>;
else
<переходим по второй ссылке>;

Автор: ОнКофе 6.7.2006, 08:55

skyboy, а вот это самое "<переходим по первой ссылке>;" как сделать? window.open?

Автор: ОнКофе 6.7.2006, 09:18

попробовал сделать в DreamWeawer ....

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
<TITLE>Untitled Document</TITLE>
<script type="text/JavaScript">
<!--
function Jmenu(targ,SelOption,restore){ 
  eval(targ+".location='"+SelOption.options[SelOption.selectedIndex].value+"'");
  if (restore) SelOption.selectedIndex=0;
}

function FindOp(n, d) {
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=FindOp(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function OnGo(selName,targ,restore){ 
  var SelOption = FindOp(selName); if (SelOption) Jmenu(targ,SelOption,restore);
}
//-->
</script>
</HEAD>

<BODY>
<FORM name="form1">
  <SELECT name="menu1">
    <OPTION value="http://www.ya.ru">Яndex</OPTION>
    <OPTION value="http://www.google.com">Google</OPTION>
  </SELECT>
  <INPUT type="button" name="Button1" value="Go" onClick="OnGo('menu1','parent',0)">
</FORM>
</BODY>
</HTML>

теперь не могу понять как сделать что бы при нажатии на кнопку ссылка открывалась в другом окне? Изменял в onClick="OnGo('menu1','parent',0)" параметр 'parent' на blank - не помогло. Есть выход?

Добавлено @ 09:33
А возможно ли сделать так, чтобы при нажатии на кнопку некоторые ссылки открывались в новом окне, а некоторые ссылки в этом же окне!

Автор: ОнКофе 6.7.2006, 10:21

Самое интересное что это все работает только с кнопкой

Код


<INPUT type="button" name="Button1" value="Go" onClick="OnGo('bxod','parent',0)">

если же я хочу повесить событие

Код


 onClick="OnGo('bxod','parent',0)"

на

Код


INPUT type="image" src="/images/ok.gif"value="Go" onClick="OnGo('bxod','parent',0)"

то ничего не работает!!!
Как быть?

Автор: zera 6.7.2006, 11:23

повесь на onmousedown

Автор: ОнКофе 6.7.2006, 11:38

zera, спасибо! Действительно стало работать!!!
А как же решить проблему того что они открываются в этом же окне? Есть идеи?

Автор: Aliance 6.7.2006, 14:49

Чесно говоря код мне не понравился. Предлагаю свой вариант:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>© AlianceHTMLEditor [ http://editor.sut.net.ru/editor.html ]</TITLE>
<script type="text/javascript" language="JavaScript">
<!--//--><![CDATA[//><!--

function form_location(forma) {
   var select = forma.elements["Sel1"].options[forma.elements["Sel1"].selectedIndex].value;
   if (select == 0) return;
   forma.action = select;
   forma.submit();
}

//--><!]]>
</SCRIPT>
</HEAD>

<BODY>

<FORM name="form1" action="" onsubmit="form_location(this)" method="post">
<SELECT NAME="Sel1">
<OPTION VALUE="0">choose the link</OPTION>
<OPTION VALUE="http://forum.vingrad.ru/">ссылка 1</OPTION>
<OPTION VALUE="http://www.vingrad.ru/">ссылка 2</OPTION>
</SELECT>
<BR />
<INPUT type="image" src="http://forum.vingrad.ru/uploads/av-5467.gif" onclick="form_location(this.form)" />
</FORM>

</BODY>
</HTML>

Это немного кривоватый код, можно его переписать так:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>© AlianceHTMLEditor [ http://editor.sut.net.ru/editor.html ]</TITLE>
<script type="text/javascript" language="JavaScript">
<!--//--><![CDATA[//><!--

function form_location(forma) {
   var select = forma.elements["Sel1"].options[forma.elements["Sel1"].selectedIndex].value;
   if (select == 0) return;
   location.href = select;
}

//--><!]]>
</SCRIPT>
</HEAD>

<BODY>

<FORM name="form1" action="" onsubmit="form_location(this); return false;" method="post">
<SELECT NAME="Sel1">
<OPTION VALUE="0">choose the link</OPTION>
<OPTION VALUE="http://forum.vingrad.ru/">ссылка 1</OPTION>
<OPTION VALUE="http://www.vingrad.ru/">ссылка 2</OPTION>
</SELECT>
<BR />
<INPUT type="image" src="http://forum.vingrad.ru/uploads/av-5467.gif" onclick="form_location(this.form); return false;" />
</FORM>

</BODY>
</HTML>

Автор: ОнКофе 6.7.2006, 15:20

попробовал....
все равно открывается в этом же окне....
Неуже ли никак нельзя сделать чтобы ссылка открывалась в другом окне?

Слушай а для чего у тебя написано

Код


<!--//--><![CDATA[//><!--

не понятно что-то!!! Объясни пожалуйста!

Автор: Aliance 6.7.2006, 18:13

А, в другом. А я делал, чтобы она в том же открывалась :-) Можно канечно, лови:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>© AlianceHTMLEditor [ http://editor.sut.net.ru/editor.html ]</TITLE>
<script type="text/javascript" language="JavaScript">
<!--//--><![CDATA[//><!--

function form_location(forma) {
   var select = forma.elements["Sel1"].options[forma.elements["Sel1"].selectedIndex].value;
   if (select == 0) return;
   window.open(select, 'newWin');
}

//--><!]]>
</SCRIPT>
</HEAD>

<BODY>

<FORM name="form1" action="" onsubmit="form_location(this); return false;" method="post">
<SELECT NAME="Sel1">
<OPTION VALUE="0">choose the link</OPTION>
<OPTION VALUE="http://forum.vingrad.ru/">ссылка 1</OPTION>
<OPTION VALUE="http://www.vingrad.ru/">ссылка 2</OPTION>
</SELECT>
<BR />
<INPUT type="image" src="http://forum.vingrad.ru/uploads/av-5467.gif" onclick="form_location(this.form); return false;" />
</FORM>

</BODY>
</HTML>

По твоему второму вопросу, зайди в поиск по слову CDATA

Автор: ОнКофе 6.7.2006, 19:00

последний твой код отлично работает в FireFox, а в IE сразу открываются два новых окна, а в основном окне (откуда происходит переход) выскакивает ошибка....
мдя.....

Автор: Aliance 6.7.2006, 20:49

Я работаю только в ИЕ 6 SP 2, у меня открывается только одно окно.

Автор: ОнКофе 7.7.2006, 10:58

Aliance, а как же быть с остальными? Никак что ли не сделать? Может есть какой-то другой вариант открытия?

Автор: ОнКофе 7.7.2006, 12:45

Все работает! Спасибо!

Автор: Aliance 7.7.2006, 21:04

Я написал это в плане того, что я просматриваю странички в ИЕ, а скрипты пишу естественно кросплатформенные и только.
У тебя был какой-то глюк, видимо. Так как, повторюсь, в ИЕ все прекрасно работало.

Автор: ОнКофе 10.7.2006, 16:28

Aliance, убрал из твоего кода строки

Код


<!--//--><![CDATA[//><!--

//--><!]]>

все работает и без них... не могу понять для чего тогда ты вездешь их пишешь?

Автор: 12345c 10.7.2006, 18:26

Это для совместимости с XHTML, чтобы код был валидным для XML-парсера, обычным браузерам он не нужен.

А вообще непонятно, откуда столько проблем, исходя из поставленной задачи (перейти по ссылке, выбранной в списке), код в 1 строчку:

Код


<FORM name="form1" onsubmit=location.href='http://'+this.Sel1.value;return!1>
<SELECT NAME="Sel1">
<OPTION VALUE="yandex.ru">ссылка 1
<OPTION VALUE="rambler.ru">ссылка 2
</SELECT><br>
<INPUT type="image" src="/images/images.gif"></FORM>

Автор: Aliance 14.7.2006, 12:10

12345c, а как же совместимость с XHTML? smile

</option> забыл и кавычки в onsubmit smile

Автор: ОнКофе 14.7.2006, 12:24

Aliance, а закрывать option обязательно нужно?
И что там по поводу с совместимости с XHTML? И чем это все грозит?

Автор: Aliance 14.7.2006, 13:05

Цитата(ОнКофе @ 14.7.2006, 13:24

)

а закрывать option обязательно нужно?

будет работать и без, но, если не ошибаюсь, тот же стандарт XHTML требует закрывать.

Цитата(ОнКофе @ 14.7.2006, 13:24

)

И что там по поводу с совместимости с XHTML? И чем это все грозит?

Если ты не работаешь с XML и не ставишь DOCTYPE равным стандарту XHTML - то ничем.