2014-08-09 2 views
-1

Я использую следующий код, чтобы закрепить две кнопки в форме. Но кнопки будут появляться один за другим. Я хочу сказать, что одна кнопка будет первой и чуть ниже, что придет еще одна кнопка.Как разместить две кнопки в одной строке

фрагмент кода

<form name="myform" action="xxxx.cgi" method="POST"> 
<input type="submit" value="hello" name="d"> 
</form> 
<form name="myform" action="yyyy.cgi" method="POST"> 
<input type="submit" value="hai" name="dd"> 
</form> 

Я могу поместить две кнопки в одном ряду со следующим кодом.

<form name="myform" action="xxxx.cgi" method="POST"> 
<input type="submit" value="hello" name="d"> 
<input type="submit" value="hai" name="dd"> 
</form> 

Но обе кнопки будут загружать xxxx.cgi по клику. Что я могу сделать, чтобы разместить две кнопки на веб-странице в той же строке, в которой первая кнопка будет загружать xxxx.cgi на клик, а вторая кнопка будет загружать yyyy.cgi при нажатии. Пожалуйста, помогите

По Доминика

+0

это не Perl QST ... имхо .. – jm666

ответ

0

Добавить стиль, как это в вашем CSS

form{ 
    float:left; 
} 

Смотрите эту fiddle

я использовал эту разметку, поскольку это право один

<form name="myform" action="xxxx.cgi" method="POST"> 
    <input type="submit" value="hello" name="d"> 
</form> 
<form name="myform" action="yyyy.cgi" method="POST"> 
    <input type="submit" value="hai" name="dd"> 
</form> 

другой использует две кнопки wi одно и то же имя.

Одна из проблем с приведенным выше кодом заключается в том, что он использует две формы на одной странице, которые могут иногда создавать проблемы.

Поэтому использовать только один вид

Смотрите fiddle для этого ..

0

Вы можете использовать либо поплавок: левый для элемента формы или вы можете использовать дисплей: встроенный блок

form{display: inline-block;} 

См. http://jsfiddle.net/

0

Html

<form name="myform" class='myform' action="xxxx.cgi" method="POST"> 
    <input type="submit" value="hello" name="d"> 
</form> 
<form name="myform" class='myform' action="yyyy.cgi" method="POST"> 
    <input type="submit" value="hai" name="dd"> 
</form> 

Вы можете поместить стиль в обе формы со следующим css.

.myform 
{ 
    float: left; 
} 
0

эй @Dominic вот что вы можете сделать, чтобы исправить problem.You просто использовать некоторые JavaScript.

создать две формы, но поместите обе кнопки в одной форме

<body> 
<form action='1.php' name='first'> 
<input type="button" value='1.php' id='one'/> 
<input type="button" value='2.php' id='two'/> 
</form> 
<form action='2.php' name='second'> 

</form> 
</body> 

Trigger действия с помощью JavaScript

var one = document.getElementById('one'); 
one.onclick=function(){ 
alert(document.first.submit()); 
} 

var two = document.getElementById('two'); 
two.onclick=function(){ 
alert(document.second.submit()); 
} 
Смежные вопросы