2015-11-19 50 views
3

我在我的代码中使用委托jquery,但当它触发一些事件它不止一次触发,我知道这是因为我已经绑定了事件optionclicked类到框 - 主类,但我处于一种情况下,我必须将这些类彼此绑定,因为使用选项点击类的内容是动态生成的。 有AY问题的解决,使火灾事件只有一次意味着一次通话功能和显示弹出运一次和后一次数据等等等等JQUERY事件触发不止一次,当使用委托jquery

$('.boxes-main').on('click', '.optionclicked', function(){ 
    // do something 
    var timetoclick = parseFloat($('#time').text()); 
    clearInterval(myCounter); 
    var optionclicked = $(this).attr('data'); 
    var questionid = $(this).attr('data2'); 
    $.post("quesanscheck.php", { 
     ans : optionclicked, 
     id : questionid, 
     time : timetoclick 
    }, function(data, status) { 
     alert(data); 
     if(data == optionclicked) 
     { 
      //alert("dfad"); 
      setTimeout(function(){ rightans(); }, 1000); 
     } 
     else 
     { 
      // wrong ans red 
      if(optionclicked == 'A') 
      { 
       document.getElementById('op1').style.background = "red"; 
       document.getElementById('op1').style.border = "0px"; 
      } 
      if(optionclicked == 'B') 
      { 
       document.getElementById('op2').style.background = "red"; 
       document.getElementById('op2').style.border = "0px"; 
      } 
      if(optionclicked == 'C') 
      { 
       document.getElementById('op3').style.background = "red"; 
       document.getElementById('op3').style.border = "0px"; 
      } 
      if(optionclicked == 'D') 
      { 
       document.getElementById('op4').style.background = "red"; 
       document.getElementById('op4').style.border = "0px"; 
      } 
      // right ans green 
      if(data == 'A') 
      { 
       document.getElementById('op1').style.background = "green"; 
       document.getElementById('op1').style.color = "white"; 
       document.getElementById('op1').style.border = "0px"; 
      } 
      if(data == 'B') 
      { 
       document.getElementById('op2').style.background = "green"; 
       document.getElementById('op2').style.color = "white"; 
       document.getElementById('op2').style.border = "0px"; 
      } 
      if(data == 'C') 
      { 
       document.getElementById('op3').style.background = "green"; 
       document.getElementById('op3').style.color = "white"; 
       document.getElementById('op3').style.border = "0px"; 
      } 
      if(data == 'D') 
      { 
       document.getElementById('op4').style.background = "green"; 
       document.getElementById('op4').style.color = "white"; 
       document.getElementById('op4').style.border = "0px"; 
      } 
      setTimeout(function(){wrongans();}, 1000); 
     } 
    }); 
}); 
+0

可否请您详细阐述_but但是当它发射一些事件时,它会多次触发_? –

+0

请在JSFiddle重现此问题。 –

+0

您的元素是否动态生成?如果不是,那么你不需要使用事件委托,或者这可能是事件传播的问题。 – Jai

回答

0

我绑定与名为event一个变量click事件,并添加代码

event.stopPropagation(); 
event.preventDefault(); 

这一个解决我的问题。

1

我也有类似的问题。

试着改变你的代码:

$('.boxes-main').unbind('click').on('click', '.optionclicked', function(){ 

这将删除所有点击事件,并增加了一个单独的事件。

当我看着这个,点击事件发射两次,即使点击事件只添加一次。

我无法找到帮助我的原始SO帖子,但这对我有效。

+0

Sory先生,这不适合我,问题仍然是一样的 –