jQuery-click-Ereignis nicht ausgelöst wird, auf die Schaltfläche in form

Ich habe einen button in einem form wie diesem:

<form>
   <input type="text" />
   <input type="password" />
   <button type="button" class="btn-login">Log in</button>
 </form>

Ich versuche zum auslösen der Schaltfläche click-Ereignis dadurch in der js:

$(document).ready(function () {
     $('.btn-login').live("click", function () {
          alert("Button clicked!");
      });
});

Aber aus irgendeinem Grund, das wird nicht funktionieren.

Wenn ich entfernen Sie die <form></form> ist rund um die Textfelder und die Schaltfläche, wird das click-Ereignis ausgelöst wird, das bedeutet aber auch, dass meine Seite nicht angezeigt wird, richtig, so Frage ich mich, ob es einen Weg gibt, der zum auslösen der Schaltfläche click-Ereignis, wenn im inneren der form.

Keine Ahnung warum wickelte Sie in ein <form> tag brechen würde es aber versuchen, mit .on('click' statt .live
jquery-version verwendet
scheint in Ordnung hier jsfiddle.net/arunpjohny/PVMca/1
Ist diese form Hinzugefügt via ajax in den DOM, wie Sie Leben
als pro http://www.w3schools.com/tags/tag_button.asp Tips and Notes Note: If you use the <button> element in an HTML form, different browsers may submit different values. Use <input> to create buttons in an HTML form.

InformationsquelleAutor bale3 | 2013-04-24

2

Wenn Sie mit der neuesten version von Jquery, die versuchen on statt live wie es ist veraltet in der version 1.9. Wenn Sie mit version 1.7 dann ist dein code funktioniert.
```
$(document).ready(function () {
     $('.btn-login').on("click", function () {
          alert("Button clicked!");
      });
});
```
JS Fiddle .auf () - Beispiel

JS Fiddle .live () - Beispiel
- Danke, das war der trick , akzeptieren Sie die Antwort, sobald ich kann!
InformationsquelleAutor Sachin
1

.live Function() wurde entfernt, da von jQuery 1.9 .
Referenz: http://api.jquery.com/live/

Bitte verwenden .auf () - Funktion für die Bindung an die Ereignisse.
Referenz: http://api.jquery.com/on/

Lösung:
```
$(document).ready(function () {
     $('.btn-login').on("click", function () {
          alert("Button clicked!");
      });
});
```
InformationsquelleAutor Mysteryos
0

Glaube ich unter code sollte für Sie arbeiten
```
$(document).ready(function () {
     $(document).delegate('.btn-login', "click", function () {
          alert("Button clicked!");
      });
});
```
Es nutzt delegieren von jquery, so dass selbst wenn es wird Hinzugefügt, später im DOM mit ajax, diese Funktion funktionieren würde.

InformationsquelleAutor Sudesh

Können Sie migrieren 1.1.0 auf 1.9.1 nutzen .live()

$(document).ready(function () {
     $('.btn-login').live("click", function () {
          alert("Button clicked!");
      });
});

[Beispiel] (http://jsfiddle.net/3hQbG/)

InformationsquelleAutor Dhaval Marthak

0

Meine Vermutung ist, dass Sie eine neuere version von jquery, getestet habe ich mit der 1.9.1 und jQuery.live funktioniert nicht (entfernt jquery 1.9). Eine einfache änderung jQuery.auf und Sie sprang sofort zum Leben.
```
<form>
    <input type="text" />
    <input type="password" />
    <button type="button" class="btn-login">Log in</button>
</form>

$(document).ready(function () {
    $('.btn-login').on("click", function () {
        alert("Button clicked!");
    });
});
```
auf jsfiddle

Als Hinweis auf Kommentare, dies ist, was der W3C zu sagen hat

Schaltflächen erstellt, mit dem BUTTON-element funktionieren wie Schaltflächen
erstellt mit dem INPUT-element, aber Sie bieten reicher rendering
Möglichkeiten: das BUTTON-element kann Inhalt haben. Zum Beispiel, eine
BUTTON-element, das ein Bild enthält Funktionen wie und Aussehen kann
ein INPUT-element, dessen Typ auf "Bild", aber das BUTTON-element
geben Sie Inhalte erlaubt.

Das Button-Element - W3C

Dieser Artikel beschreibt einige der Unterschiede zwischen der Taste und Eingabe

Und was W3cschools Beratung?

Tipps und Hinweise Hinweis: Wenn Sie das element in ein HTML-Formular,
verschiedene Browser mitteilen können, unterschiedliche Werte. Erstellen
buttons in einem HTML-Formular.

W3cschools: HTML-Tag

w3cschools sind nicht MAßGEBEND Körper. Soweit ich das beurteilen kann, der einzige Browser, der hatte echt Probleme waren IE6 & IE7, also ich denke, Ihr Rat ist ein wenig veraltet. Es ist möglich, dass es andere gibt, aber ich konnte nicht finden, alles Beton. die beste, die ich finden konnte, war auf MDN <\ - Taste>

IE7 hat einen bug, wo beim Absenden eines Formulars mit Klick mich an, die POST-Daten geschickt werden
Ergebnis in myButton=Klick mich statt myButton=foo. Der IE6 hat noch
schlimmer bug, wo es ein Formular über eine Schaltfläche submit ALL
Schaltflächen des Formulars, mit dem gleichen Fehler wie IE7, Dieser Fehler wurde behoben
im IE8
- als pro http://www.w3schools.com/tags/tag_button.asp Tips and Notes Note: If you use the <button> element in an HTML form, different browsers may submit different values. Use <input> to create buttons in an HTML form.
InformationsquelleAutor Xotic750
-1

statt
```
<button type="button" class="btn-login">Log in</button> 
```
verwenden
```
<input type="button" class="btn-login">Log in</input>
```
- http://www.w3schools.com/tags/tag_button.asp Es ist html5-code, daher gültig.
- als pro http://www.w3schools.com/tags/tag_button.asp Tips and Notes Note: If you use the <button> element in an HTML form, different browsers may submit different values. Use <input> to create buttons in an HTML form.
- Ich glaube nicht, dass w3schools Tipps sind MAßGEBEND genug, dass die OP ändern muss-element-Typ.
InformationsquelleAutor rahul maindargi

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.