preventDefault不适用于ajax请求

Question

我的preventDefault事件不起作用，但不能保证原因。我四处搜寻，但没有意识到问题在哪里。如果我的情况有所回答，请原谅！这是我的代码：

var $vote_btn_up = $('.vote_comment_up_' + <?= $model->id ?>); 
var $vote_btn_down = $('.vote_comment_down_' + <?= $model->id ?>); 

$vote_btn_up.on('click', function (evt) { 
    evt.preventDefault(); 
    var $commentId = 0; 
    var $postId = 0; 
    if($vote_btn_up.data('comment_id') != 0){ 
     var $commentId = $vote_btn_up.data('comment_id'); 
    } 
    if($vote_btn_up.data('post_id') != 0){ 
     var $postId = $vote_btn_up.data('post_id'); 
    } 
    var $flag = $vote_btn_up.data('flag'); 
    var $userId = $vote_btn_up.data('user_id'); 
    $.ajax({ 
     method : 'post', 
     url : '/admin/site/like-dislike', 
     data : {flag : $flag, comment_id : $commentId, user_id : $userId, post_id : $postId}, 
     success : function(data){ 
      console.log(data); 
      if($flag == 1){ 
       $('.thumb-up_<?= $model->id ?>').text(data); 
      }else if($flag == 2){ 
       $('.thumb-down_<?= $model->id ?>').text(data); 
      } 
     } 
    }); 
}); 

Answer 1

你想防止什么行为？ evt.preventDefault()如果你有一个表单，并且该按钮是一个提交按钮，并且你想阻止提交表单，那么这个方法就可以工作。然而，这些都是很多假设由我...

var $vote_btn_up = $('.vote_comment_up'); 
 

 
$vote_btn_up.on('click', function (evt) { 
 
    evt.preventDefault(); 
 
    console.log("log"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="http://google.de"> 
 
    <button type="submit" class="vote_comment_up"> 
 
    Button 
 
    </button> 
 
</form>

Answer 2

我认为你创造更多然后一个按钮：

var $vote_btn_up = $('.vote_comment_up_' + <?= $model->id ?>); 

如果是的话那么接下来的覆盖早...所以尝试把它们放在阵列中，然后你需要为每个按钮设置处理程序，例如：

for(var i=0;i<=X;i++){ 
    $vote_btn_up[i].on('click',function(){ 

    }); 
}); 

或者：

$('.vote_comment_up_' + <?= $model->id ?>).each(function(){ 
    $(this).on('click',function(){ 

    }); 
});