HTML forma su dviem pateikimo mygtukais ir dviem tiksliniais atributais

Sveiki, turiu vieną html <form>.

Forma turi tik vieną atributą action="" .

Tačiau noriu turėti 2 skirtingus target="" atributus, priklausomai nuo to, kurį mygtuką paspausite, kad pateiktumėte formą. Tai tikriausiai yra fantastinis javascript, bet aš nežinau, kur pradėti.

Bet kokių idėjų, kaip galėčiau sukurti du mygtukus, kiekvienas iš jų yra viena forma, bet kiekvienas mygtukas suteikia formą kitam tikslui?

AČIŪ!

67
03 июня '09 в 5:13 2009-06-03 05:13 „Stoob“ yra nustatytas birželio 03 d., 05:13, 2009-06-03 05:13
@ 14 atsakymų

Labiau tikslinga kreiptis į šią problemą, nes formoje bus numatytasis veiksmas, susijęs su vienu pateikimo mygtuku, ir tada alternatyvus veiksmas, susijęs su paprastu mygtuku. Skirtumas yra tas, kad priklausomai nuo to, kuris iš jų bus pateiktas, bus naudojamas tas, kuris bus naudojamas, kai naudotojas pateikia formą paspausdami įvesties klavišą, o kitas bus paleistas tik tada, kai vartotojas aiškiai paspaudžia mygtuką.

Bet kokiu atveju, turint tai omenyje, ji turėtų tai padaryti:

 <form id='myform' action='jquery.php' method='GET'> <input type='submit' id='btn1' value='Normal Submit'> <input type='button' id='btn2' value='New Window'> </form> 

Naudojant šį „JavaScript“:

 var form = document.getElementById('myform'); form.onsubmit = function() { form.target = '_self'; }; document.getElementById('btn2').onclick = function() { form.target = '_blank'; form.submit(); } 

Apskritai, kurie susieja kodą su pateikimo mygtuko įvykiu, neveiks IE.

56
03 июня '09 в 5:37 2009-06-03 05:37 atsakymą pateikė Paolo Bergantino birželio 03 d., 05:37, 2009-06-03 05:37

Tai darau serverio pusėje. Tai reiškia, kad forma visada laikosi to paties tikslo, bet turiu serverio pusės scenarijų, kuris yra atsakingas už nukreipimą į tinkamą vietą, priklausomai nuo to, kuris mygtukas buvo paspaudžiamas.

Pavyzdžiui, jei turite keletą mygtukų

 <form action="mypage" method="get"> <input type="submit" name="retry" value="Retry" /> <input type="submit" name="abort" value="Abort" /> </form> 

Pastaba: aš naudoju GET, bet jis veikia ir POST

Tada galite lengvai nustatyti, kuris mygtukas buvo paspaudžiamas - jei egzistuoja retry kintamasis ir turi vertę, tada paspaudžiamas retry bandymas ir, jei egzistuoja abort kintamasis ir turi vertę, spaudimas nutraukiamas. Šios žinios gali būti naudojamos nukreipti į tinkamą vietą.

Šis metodas nereikalauja Javascript.

Pastaba kad kai kurios naršyklės galėtų išsiųsti formą nespaudžiant jokių mygtukų (paspaudus įvesties klavišą). Tokio nestandartinio pobūdžio, tai reikia atsižvelgti į tai, turėdami aiškų default veiksmą ir jį suaktyvinus, kai nepaspaudžiami jokie mygtukai. Kitaip tariant, įsitikinkite, kad jūsų forma daro kažką pagrįsto (nesvarbu, ar ji rodo naudingą klaidos pranešimą, ar pagal nutylėjimą), kai kas nors pasiekia kitų formų elementų paspaudimus, o ne paspaudus mygtuką „Siųsti“, o ne tik pertrauka .

72
03 июня '09 в 6:03 2009-06-03 06:03 atsakymą pateikė thomasrutter birželio 03 '09, 6:03 2009-06-03 06:03

Jei naudojate HTML5, galite tiesiog naudoti formaction atributą:

 <!DOCTYPE html> <html> <body> <form> <input type="submit" formaction="firsttarget" value="Submit to first" /> <input type="submit" formaction="secondtarget" value="Submit to second" /> </form> </body> </html> 
44
27 марта '12 в 20:18 2012-03-27 20:18 Atsakymą Kopporas pateikia kovo 27 d. 12 d. 20:18 2012-03-27 20:18

Jis veikia man:

 <input type='submit' name='self' value='This window' onclick='this.form.target="_self";' /> <input type='submit' name='blank' value='New window' onclick='this.form.target="_blank";' /> 
6
01 окт. atsakymas suteiktas Trojan 01 okt. 2013-10-01 17:02 '13, 17:02 2013-10-01 17:02

Šiame pavyzdyje, paimtas iš

http://www.webdeveloper.com/forum/showthread.php?t=75170

Galite matyti, kaip keisti taikinį „onclick“ renginyje.

 function subm(f,newtarget) { document.myform.target = newtarget ; f.submit(); } <FORM name="myform" method="post" action="" target="" > <INPUT type="button" name="Submit" value="Submit" onclick="subm(this.form,'_self');"> <INPUT type="button" name="Submit" value="Submit" onclick="subm(this.form,'_blank');"> 
4
03 июня '09 в 5:22 2009-06-03 05:22 tekBlues atsakymas birželio 03 d. 09 val. 5:22 AM 2009-06-03 05:22
 <form id='myForm'> <input type="button" name="first_btn" id="first_btn"> <input type="button" name="second_btn" id="second_btn"> </form> <script> $('#first_btn').click(function(){ var form = document.getElementById("myForm") form.action = "https://foo.com"; form.submit(); }); $('#second_btn').click(function(){ var form = document.getElementById("myForm") form.action = "http://bar.com"; form.submit(); }); </script> 
1
15 мая '15 в 5:18 2015-05-15 05:18 atsakymas duotas jbowen7 gegužės 15 '15 , 5:18 2015-05-15 05:18

Čia pateikiamas greitas scenarijaus pavyzdys, rodantis formą, kuri pakeičia tikslinį tipą:

 <script type="text/javascript"> function myTarget(form) { for (i = 0; i < form.target_type.length; i++) { if (form.target_type[i].checked) val = form.target_type[i].value; } form.target = val; return true; } </script> <form action="" onSubmit="return myTarget(this);"> <input type="radio" name="target_type" value="_self" checked /> Self <br/> <input type="radio" name="target_type" value="_blank" /> Blank <br/> <input type="submit"> </form> 
1
03 июня '09 в 5:34 2009-06-03 05:34 Atsakymą įteikė Kai birželio 03 '09, 5:34 2009-06-03 05:34

Paprasta ir intuityvi, ji nusiųs paspaudusio mygtuko pavadinimą, o po to derins, kad padarytų viską, ką norite. Tai gali sumažinti dviejų tikslų poreikį. Mažiau puslapių ...!

 <form action="twosubmits.php" medthod ="post"> <input type = "text" name="text1"> <input type="submit" name="scheduled" value="Schedule Emails"> <input type="submit" name="single" value="Email Now"> </form> 

twosubmits.php

 <?php if (empty($_POST['scheduled'])) { // do whatever or collect values needed die("You pressed single"); } if (empty($_POST['single'])) { // do whatever or collect values needed die("you pressed scheduled"); } ?> 
1
04 нояб. Atsakymą pateikė Mikeys4u 04 lapkričio. 2013-11-04 18:42 '13, 18:42 2013-11-04 18:42

Jis veikia serverio pusėje.

 <button type="submit" name="signin" value="email_signin" action="/signin">Sign In</button> <button type="submit" name="signin" value="facebook_signin" action="/facebook_login">Facebook</button> 

ir ant mano šono serverio mazgo scenarijų

 app.post('/', function(req, res) { if(req.body.signin == "email_signin"){ function(email_login) {...} } if(req.body.signin == "fb_signin"){ function(fb_login) {...} } }); 
1
28 апр. atsakymą pateikė Yunus Khan 28 balandis. 2016-04-28 14:06 '16 at 14:06 2016-04-28 14:06

Pavyzdys:

 <input type="submit" onclick="this.form.action='new_target.php?do=alternative_submit'" value="Alternative Save" /> 

Voila. Labai beprotiškas, trijų žodžių javascript!

1
12 июня '13 в 10:21 2013-06-12 10:21 atsakymą Rolfas pateikė birželio 13 d. 13 val. 10:21 2013-06-12 10:21

HTML:

 <form method="get"> <input type="text" name="id" value="123"/> <input type="submit" name="action" value="add"/> <input type="submit" name="action" value="delete"/> </form> 

Js:

 $('form').submit(function(ev){ ev.preventDefault(); console.log('clicked',ev.originalEvent,ev.originalEvent.explicitOriginalTarget) }) 

http://jsfiddle.net/arzo/unhc3/

1
21 авг. atsakymas suteiktas test30 21 rug . 2013-08-21 16:28 '13, 16:28 2013-08-21 16:28

Kiekviename iš mygtukų galite turėti:

 <input type="button" name="newWin" onclick="frmSubmitSameWin();"> <input type="button" name="SameWin" onclick="frmSubmitNewWin();"> 

Tada turime keletą mažų js funkcijų:

 <script type="text/javascript"> function frmSubmitSameWin() { form.target = ''; form.submit(); } function frmSubmitNewWin() { form.target = '_blank'; form.submit(); } </script> 

Tai turėtų padaryti apgauti.

0
03 июня '09 в 5:27 2009-06-03 05:27 Atsakymą įteikė krikščionis birželio 03 d., 05:27, 2009-06-03 05:27

Alternatyvus sprendimas. Negalima jausti su „onclick“, mygtukais, serverio pusėje ir viskas. Tiesiog sukurkite naują formą su tuo pačiu veiksmu.

 <form method=post name=main onsubmit="return validate()" action="scale_test.html"> <input type=checkbox value="AC Hi-Side Pressure">AC Hi-Side Pressure<br> <input type=checkbox value="Engine_Speed">Engine Speed<br> <input type=submit value="Linear Scale" /> </form> <form method=post name=main1 onsubmit="return v()" action=scale_log.html> <input type=submit name=log id=log value="Log Scale"> </form> 

Dabar „JavaScript“ galite gauti visus pagrindinės formos elementus v () su getElementsByTagName () . Jei norite sužinoti, ar >

 function v(){ var check = document.getElementsByTagName("input"); for (var i=0; i < check.length; i++) { if (check[i].type == 'checkbox') { if (check[i].checked == true) { x[i]=check[i].value } } } console.log(x); } 
0
11 февр. Atsakymą pateikė Kaushal Paneri , vasario 11 d. 2014-02-11 07:35 '14, 7:35 AM 2014-02-11 07:35

Abu mygtukai siunčiami į esamą puslapį, tada pridėkite šį kodą viršuje:

 <?php if(isset($_GET['firstButtonName']) header("Location: first-target.php?var1={$_GET['var1']} if(isset($_GET['secondButtonName']) header("Location: second-target.php?var1={$_GET['var1']} ?> 

Tai taip pat galima padaryti naudojant $ _SESSION, jei nenorite, kad jie matytų kintamuosius.

0
24 нояб. Atsakymas duotas Brendan Long 24 lapkričio. 2009-11-24 20:46 '09, 20:46, 2009-11-24 20:46

Kiti klausimai apie „ žymes arba Užduoti klausimą