Why Callback is not working

Siddangoud Bharamagoudar 61

Hi All pls let me know why when I click on div1 it is not working As like callback function

div1

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Hide on Mouseover Example</title>
  <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
</head>
<body>

<div id="hideDiv" >
<br>
  <div  id="div1">fsdfsdfsdfs</div>

  <!-- Content inside the div -->
  <p>This is some content inside the div.</p>
</div>

<script>
  $(document).ready(function() {
    // Attach mouseenter event handler to the div
    $("#hideDiv").on("mouseenter", function() {
      // Hide the div with animation
      $(this).hide("slow", function() {
        console.log("The div is now hidden.");
      });
    });

    $("#div1").click(alert('kk'),function(){
      
    });



  });
</script>

</body>
</html>

Viorel 112.5K Reputation points

2024-02-12T18:19:28.12+00:00
Maybe you should write this:

$("#div1").click(function() { alert('kk'); });

Make sure that div1 is visible.
Siddangoud Bharamagoudar 61 Reputation points

2024-02-13T05:06:05.47+00:00

my question is that I know , I written wrong code why it is wrong

2 answers

Bruce (SqlWork.com) 56,686 Reputation points

2024-02-12T20:42:48.05+00:00
your code:

$("#div1").click(alert('kk'),function(){ });

when executed at startup calls alert() and passes the alert() return value (void) as the event data to be passed to the callback method, the actual callback function does nothing.
Please sign in to rate this answer.

0 comments No comments
Sign in to comment
Pinaki Ghatak 2,400 Reputation points Microsoft Employee

2024-02-13T18:34:59.7966667+00:00
Hello @Siddangoud Bharamagoudar

The issue is with the way you’re attaching the click event handler to #div1. The alert('kk') is being executed immediately when the page loads, not when #div1 is clicked. This is because alert('kk') is a function call, not a function definition. Here’s how you can fix it:

<script> $(document).ready(function() { // Attach mouseenter event handler to the div $("#hideDiv").on("mouseenter", function() { // Hide the div with animation $(this).hide("slow", function() { console.log("The div is now hidden."); }); }); // Correct way to attach click event handler $("#div1").click(function(){ alert('kk'); }); }); </script>

In this corrected code, alert('kk') is wrapped inside a function definition, which will be called when #div1 is clicked.

This should make your click event work as expected. If this solves your question, please tag this as answered, to help other community readers who may have similar questions.
Please sign in to rate this answer.
Siddangoud Bharamagoudar 61 Reputation points

2024-02-14T05:37:28.1933333+00:00

$("#div1").click(function(){ alert('JJJJJJ'); },function(){ alert('KKKKKKKK4646'); }); why this only execauting second function only, why not first function

Bruce (SqlWork.com) 56,686 Reputation points

2024-02-14T16:25:30.29+00:00

When you pass two parameters to click, the first is parameter is used to define the event data to the callback. In your case you are passing a function. But you have no code to call it. You could add

$("#div1").click(function(){ alert('JJJJJJ'); },function(e){ alert('KKKKKKKK4646'); e.data(); // call passed function });
Sign in to comment