Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Скрытие форм / закладки


Автор: v2v 29.10.2007, 00:31
есть 4 формы
Код


<form action="f1" method="post">
...
</form>

<form action="f2" method="post">
...
</form>

<form action="f3" method="post">
...
</form>

<form action="f4" method="post">
...
</form>


как мне сделать так что бы на одной(!) страничке  в одно и тоже время была видна только одна форма из 4х, остальные 3 были скрыты. И управление:  4 толи кнопки, толи ссылки, для поочерёдного открытия всех по очерёдности форм.
было бы не плохо какое то подобие примера. благодарен заранее... 

Автор: dstorm81 29.10.2007, 10:59
Код

<html>
<head>
<style>
form{display:none}
#frm1{display:block}
</style>
</head>
<script>
var make=function(par)
{
var formsAr=document.getElementsByTagName("form");
for(var i=0;i<formsAr.length;i++)
    {
    formsAr[i].style.display="none";
    }
document.getElementById("frm"+par).style.display="block";
return false;
}
</script>
<body>
<form id="frm1" action="f1" method="post">
<input type="text" value="1">
</form>
<form id="frm2" action="f2" method="post">
<input type="text" value="2">
</form>
<form id="frm3" action="f3" method="post">
<input type="text" value="3">
</form>
<form id="frm4" action="f4" method="post">
<input type="text" value="4">
</form>
<a href="#" onclick="make(1)">отобразить1</a><br>
<a href="#" onclick="make(2)">отобразить2</a><br>
<a href="#" onclick="make(3)">отобразить3</a><br>
<a href="#" onclick="make(4)">отобразить4</a><br>
</body>
</html>

как вариант

Автор: v2v 29.10.2007, 14:03
а как ещё можно, но только таким образом что после перезагрузки страници (онСабмит) оставался выбран тот же вариант?

Автор: dstorm81 31.10.2007, 10:40
Код

<html>
<head>
<style>
form{display:none}
#frm1{display:block}
</style>
</head>
<body>
<form id="frm1" action="qq.html?1" method="post">
<input type="text" value="1"><input type="submit" name="f1">
</form>
<form id="frm2" action="qq.html?2" method="post">
<input type="text" value="2"><input type="submit" name="f2">
</form>
<form id="frm3" action="qq.html?3" method="post">
<input type="text" value="3"><input type="submit" name="f3">
</form>
<form id="frm4" action="qq.html?4" method="post">
<input type="text" value="4"><input type="submit" name="f4">
</form>
<a href="#" onclick="make(1)">отобразить1</a><br>
<a href="#" onclick="make(2)">отобразить2</a><br>
<a href="#" onclick="make(3)">отобразить3</a><br>
<a href="#" onclick="make(4)">отобразить4</a><br>
<script>
var make=function(par)
{
var formsAr=document.getElementsByTagName("form");
for(var i=0;i<formsAr.length;i++)
    {
    formsAr[i].style.display="none";
    }
try{document.getElementById("frm"+par).style.display="block";}
catch(e){document.getElementById("frm1").style.display="block";}
return false;
}
make(location.search.replace('?',''))//вот здесь славое место, сразу оговорюсь, здесь следует использовать регулярку
</script>
</body>
</html>

и прицеплять к ?show=число, а лучше всего логику отображения делать на серваке
на клиенте может быть много всяких НО, которые создадут проблемки

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)