单击for循环中的div获得单个事件

Question

var id=100;

for(var i=0;i<5;i++) {
 $("#divtext_"+id).click(function(e) {
   onClicked();
 });
}

function onClicked() {
  alert("Clicked")
}

• I tried with .on() , delegate() , and one() events.
• When I clicked div, the onClicked() function gave an alert() 4 times.
• Is it possible when I click div text/image to get one time function/alert?

Answer 1

This is how I would expect the code to run under jquery, the options here would be to either use .unbind ( http://api.jquery.com/unbind/ ) to remove all previous instructions for this div or to check if the event has already been bound, this has been covered here. How to check if click event is already bound - JQuery

Answer 2

Presuming you have divs with IDs divtext_0 ... divtext_4

for(var i=0;i<5;i++) {
 $("#divtext_"+i).click(function(e) {
   onClicked();
 });
}

function onClicked() {
  alert("Clicked")
}

At the moment you are adding multiple click handlers to the div divtext_100 - rather than adding one click handler to multiple divs.

It is hard to say what is best without seeing your HTML - but if you gave all your divs a class, eg 'clickable', then you can avoid any loops and make any div with that class clickable.

<div class="clickable"></dvi>

You could simply do.

$(".clickable").click(function(e) {
  onClicked();
});

function onClicked() {
  alert("Clicked")
}

Answer 3

try this:

$("#divtext_"+id).one("click", function(e){
  onClicked();
});

Answer 4

You can use $("#divtext_"+id).off('click',onClicked).on('click',onClicked);

function onClicked() {
    alert("Clicked")
}

'.off' prevents binding of onClicked function multiple times. I think using .off will solve your problem. If you are using older version of jquery then use .unbind .