Kotwica HTML do wysyłania danych pocztowych po kliknięciu

Question

Czy możliwe jest, aby znacznik zakotwiczenia zachowywał się jak .submit (z pewnymi cechami posta?) Powód, dla którego mam znacznik zakotwiczenia, ponieważ nie podoba mi się wygląd przycisku Wyślij i chciał CSS przycisk.

Oto co robię teraz (i to nie działa)

HTML plik

<div class="footer"><a href="#" id = "test_btn" class="button"><strong>Sign Up</strong></a></div> 

<div class="footer"><a href="#" id = "test2_btn" class="button"><strong>Sign Up</strong></a></div> 

plik js

<script type="text/javascript"> 

$("#test_btn").live("click",function(){ 
    var post_data = {'account_type':"Free"} 
    return $.post("www.someplacehere.com/user_sign_up/1/", post_data); 
}); 

$("#test2_btn").live("click",function(){ 
    var post_data = {'account_type':"Premium"} 
    return $.post("www.someplacehere.com/user_sign_up/1/", post_data); 
}); 
</script> 

uzyskać właściwą odpowiedź, ale to nie wysyła mnie na stronę danych POST po prostu przekierowuje z powrotem na górę strony (z powodu zakotwiczenia). Wszelkich pomysłów, jak sprawić, by skierowały mnie we właściwe miejsce (strona html) z danymi POST wstępnie wypełnionymi na stronie html? Jak zauważysz, nie jest to proste .submit(). Teraz prawdopodobnie przejdziemy z ukrytym polem, a następnie wykonamy .submit(), ale zastanawiamy się, czy istnieje łatwiejszy sposób na pobranie strony, ponieważ POST można wykonać poprawnie.

Dzięki!

Answer 1

Wszyscy od nowa zatrzymują ponownego wynajdowania przycisków. Już istnieją i mogą być również stylizowane.

button[type=submit] { 
    background-color: transparent; 
    border: none; 
    border-bottom: solid blue 1px; 
    color: blue; 
    font-weight: bold; 
    padding: 0px; 
    cursor: pointer; 
} 

demo'd tutaj: http://jsfiddle.net/MZbLW/

---

I należy również podkreślić, że każdy na świecie będzie szukasz tradycyjnego przycisku na końcu formularza, a dzięki czemu wyglądają zupełnie inny może nie być najlepszym pomysłem z punktu widzenia użyteczności.

Answer 2

W module obsługi kliknięcia dla łącza, zwróć wartość false, aby zatrzymać domyślną akcję.

Po prostu używałbym także funkcji click(), a nie na żywo.

Answer 3

Zdarzenie kliknięcia musi zwrócić wartość false lub uniemożliwić ustawienie domyślne.

Korzystanie z AJAX to Asynchroniczny, więc nie będziesz zwracał wartości, musisz znaleźć wartość w pełnym oddzwonieniu.

http://api.jquery.com/jQuery.post/

Answer 4

Coś jak to prawdopodobnie zbliża:

$(a.submitLink).click(function() { 
    $.post({data: values}); 

    $.post({data2: values2}); 

    return false; 
}); 

Kluczem tutaj jest, że powrót false zapobiega domyślne zachowanie dla łącza. Jeśli musisz wykonać dodatkowe przetwarzanie na podstawie wyników postu, zrób to wewnątrz funkcji wywołania zwrotnego. Nie ma powodu, aby nie można było wywoływać kilku wywołań AJAX w funkcji związanej z twoimi kotwicami, ale musisz się upewnić, że link nie działa również jako link.

Answer 5

Jedna szybka myśl dlaczego nie spróbować użyć

< przycisk type = "submit" class = "stopka" > Zarejestruj </przycisk >
zamiast
< input type = submit >

Daje to elastyczność stylizacji przycisku w dowolny sposób i zawiera również tekst. Poza tym nie musisz wykonywać całej ciężkiej pracy tworzenia niestandardowego przycisku i wysyłania go z powrotem.

Wystarczy pomyśleć.