jQuery I can't read the nodename with (document).on(click

Asked Jun 13 '23 at 18:43

Active Jun 13 '23 at 18:48

Viewed 18 times

I can't access attributes of button clicked, the result is «undefined».

Note: The example is built to avoid conflict between the function of the button and the touchstar function.

What's wrong?

$("#main").on("touchstart, touchend", () => {
  console.log("touch zone");
})

$(document).on("click", "#main a", (e) => {
    e.preventDefault();

    var ab = this.nodeName;
  var cd = $(this).prop("nodeName");
  var ef = $(this).attr("href");
  
  console.log("Button click NODENAME> "+ab);
  console.log("Button click NODENAME> "+cd);
  console.log("Button click ATTR> "+ef);
});

.main {
  width: 40vh;
  height: 90vh;
  overflow: hidden auto;
  background: Gray;
}

<section id="main" class="main">
  <h1>Title demo <a href="#">Action</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <a href="#">Action</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <a href="#">Action</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <a href="#">Action</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
  <h1>Title demo <a href="#">Action</a></h1>
  <p>Lorem Lorem Lorem Lorem Lorem Lorem</p>
</section>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

edited Jun 13 '23 at 18:48

asked Jun 13 '23 at 18:43

Renato Ramos Puma

3

`nodename` should be `nodeName`. JS is case-sensitive. – Barmar Jun 13 '23 at 18:44
1

`` elements don't have `src`. Maybe you meant `href`? – Barmar Jun 13 '23 at 18:45
3

If you use an arrow function for an event listener you have to use `e.currentTarget`, not `this`. They don't get the target as `this`. – Barmar Jun 13 '23 at 18:48
@Barmar Thanks, I didn't know about that variant with an arrow. Problem solved. – Renato Ramos Puma Jun 13 '23 at 18:51

jQuery I can't read the nodename with (document).on(click

0 Answers0