Wie behandle ich Schaltflächenklickereignisse in jQuery?

128

Ich brauche eine Schaltfläche und behandle das Ereignis in jQuery. Und ich schreibe diesen Code, aber er funktioniert nicht. Habe ich etwas verpasst?

<!-- Begin Button -->  
<div class="demo">
<br> <br> <br>   
<input id = "btnSubmit" type="submit" value="Release"/>
<br> <br> <br>  
</div>
<!-- End Button -->

Und in der Javascript-Datei

function btnClick()
{
    //    button click
    $("#btnSubmit").button().click(function(){
        alert("button");
    });    
}

jquery Ahmad Farid
quelle

1

Warum nicht einfach aus der Gehäusefunktion btnClickherausnehmen? Ich sehe nicht, was das hinzufügt

CodyBugstein

248

Sie müssen den Ereignishandler in das Ereignis $ (document) .ready () einfügen:

$(document).ready(function() {
    $("#btnSubmit").click(function(){
        alert("button");
    }); 
});

Davide Gualano
quelle

25

$(document).ready(function(){

     $('your selector').bind("click",function(){
            // your statements;
     });

     // you can use the above or the one shown below

     $('your selector').click(function(e){
         e.preventDefault();
         // your statements;
     });


});

Lawrence Gandhar
quelle

5

Gut, weil nur dieser die PreventDefault ()

einfügt

12

Ab jQuery 1.7 ist die .on()Methode die bevorzugte Methode zum Anhängen von Ereignishandlern an ein Dokument. Daher wäre dies besser:$('your selector').on("click", ...);

Tinynumbers

11

$('#btnSubmit').click(function(){
    alert("button");
});

oder

//Use this code if button is appended in the DOM
$(document).on('click','#btnSubmit',function(){
    alert("button");
});

Weitere Informationen finden Sie in der Dokumentation:
https://api.jquery.com/click/

Bruce Phillip Perez
quelle

Der im Dom angehängte Button ist immer ein Problem, wenn Sie eine Benachrichtigung wie sweetalert verwenden. Vielen Dank für den Hinweis

Deepesh Thapa

6

 $("#btnSubmit").click(function(){
        alert("button");
    });

Ali Tarhini
quelle

5

Versuche dies:

$(document).on('click', '#btnClick', function(){ 
    alert("button is clicked");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <button id="btnClick">Click me</button>

Erweitern Sie das Snippet

Rafiqul Islam
quelle

Diese Version hat den Vorteil, dass sie weiterhin funktioniert, wenn #btnClick nach der Ausführung dieses Skripts erstellt wird.

Jimbali

3

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
  $("#button").click(function(){
    alert("Hello");
  });
});
</script>

<input type="button" id="button" value="Click me">

Nivediny
quelle

1

<script type="text/javascript">

    $(document).ready(function() {

    $("#Button1").click(function() {

        alert("hello");

    });

    }
    );

</script>

Anup Ghanshala
quelle

1

$('#btnSubmit').click(function(event){
    alert("Button Clicked");
});

oder wenn Sie die Schaltfläche "Senden" verwenden, können Sie Ihren Code in das Validierungsereignis des Formulars wie schreiben

$('#myForm').validate(function(){
    alert("Hello World!!");
});

Hiren
quelle

0

Funktioniert bei mir

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$("#btn").click(function() {
    alert("email")
});

</script>

Navyad
quelle

Wie behandle ich Schaltflächenklickereignisse in jQuery?

Antworten: