Użyj zwykłego linku, aby przesłać formularz

Chcę wysłać formularz. Ale ja nie zamierzam podstawowy sposób korzystania z przycisku wejścia złożyć typ lecz do łącza.

Poniższy obraz pokazuje, dlaczego. Używam linków do zdjęć, aby zapisać / przesłać formularz. Ponieważ mam standardowe znaczniki css dla łączy do obrazów, nie chcę używać przycisków przesyłania danych wejściowych.

Próbowałem zastosować onClick = "document.formName.submit ()" do elementu a, ale wolałbym metodę html.

Jakieś pomysły?

Dwie drogi. Utwórz przycisk i nadaj mu styl tak, aby wyglądał jak łącze z css, albo utwórz łącze i użyj onclick="this.closest('form').submit();return false;".

Naprawdę nie możesz tego zrobić bez jakiejś formy skryptowania, o ile wiem.

<form id="my_form">
<!-- Your Form -->    
<a href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">submit</a>
</form>

Przykład z tego miejsca .

Po prostu stylizacja input type="submit"podobna do mnie zadziałała:

.link-button { 
     background: none;
     border: none;
     color: #0066ff;
     text-decoration: underline;
     cursor: pointer; 
}

<input type="submit" class="link-button" />

Testowane w Chrome, IE 7-9, Firefox

Używasz obrazów do przesyłania ... więc możesz po prostu użyć type="image"„przycisku” do wprowadzania danych:

<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />

posługiwać się:

<input type="image" src=".."/>

lub:

<button type="send"><img src=".."/> + any html code</button>

plus trochę CSS

Zdecydowanie nie ma rozwiązania z czystym HTML, aby przesłać formularz ze aznacznikiem link ( ). Standardowy kod HTML akceptuje tylko przyciski lub obrazy. Jak powiedzieli inni współpracownicy, można symulować wygląd linku za pomocą przycisku, ale myślę, że nie o to chodzi w tym pytaniu.

IMHO uważam, że zaproponowane i przyjęte rozwiązanie nie działa.

Przetestowałem to na formularzu, ale przeglądarka nie znalazła odniesienia do formularza.

Można więc go rozwiązać za pomocą jednej linii JavaScript, używając thisobiektu, który odwołuje się do klikanego elementu, który jest węzłem potomnym formularza, który należy przesłać. Podobnie this.parentNodejest z węzłem formularza. Po prostu wywołuje submit()metodę w tej formie. Nie jest konieczne badanie całego dokumentu, aby znaleźć odpowiednią formę.

<form action="http://www.greatsolutions.com.br/indexint.htm"                   
   method="get">
    <h3> Enter your name</h3>
    First Name <input type="text"  name="fname"  size="30"><br>
    Last Name <input type="text" name="lname" size="30"><br>
    <a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>

Przypuśćmy, że wpisuję własnym nazwiskiem:

Użyłem getatrybutu metody formularza, ponieważ po przesłaniu można zobaczyć odpowiednie parametry w adresie URL na załadowanej stronie.

http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum

To rozwiązanie oczywiście dotyczy każdego tagu, który akceptuje onclickzdarzenie lub podobne zdarzenie.

thisto doskonały wybór do odzyskania kontekstu wraz ze eventzmienną (dostępną we wszystkich głównych przeglądarkach i od IE9), której można użyć bezpośrednio lub przekazać jako argument do funkcji.

W takim przypadku zamień linię ze aznacznikiem na linię poniżej, używając właściwości target, która wskazuje element, który rozpoczął zdarzenie.

<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>

możesz użyć OnClick = "document.getElementById ('formID_NOT_NAME'). SUBMIT ()"