0

我有一个 jQuery 函数,可以在单击时交换图像。这很好用,但是,我还想使用 $.get 传递一个参数,具体取决于正在显示的图像。

这是上下文。我有一堆评论和每个旁边的“竖起大拇指”图片。单击竖起大拇指时,它变为绿色并通过 $.get 方法调用 PHP 脚本。这行得通,但我也希望用户能够“取消赞许”,这样如果他们点击一个已经是绿色的,就可以删除他们的赞成票。这是我到目前为止所拥有的。

我的 jQuery:

<script>

$(document).ready(function() {  

$('.thumb a').on('click', function(e) {

    e.preventDefault();
    var $img = $(this).find('img');

    var $idshow = $(this).attr("id");

    $img.attr('src', function(_,s) {
         return s.indexOf('thumbs_up_green') > -1 ? '../images/thumbs_up.png'
                                                  : '../images/thumbs_up_green.png'                                                                               
    });

    //HERE IS THE VARIABLE I WANT TO BE ABLE TO CHANGE
    var $action = "add";        

    $.get("thumb_up_tip.php?tip_id=" + $idshow + "&action=" + $action)      
});

});
</script> 

在上面的代码中,如果按钮从“thumbs_up.png”变为“thumbs_up_green.png”,我希望 var $action 为“add”。如果它从“thumbs_up_green.png”变为“thumbs_up.png”,那么我希望 var $action 为“减法”。

任何建议都会很棒!

4

1 回答 1

1

当添加或取消添加一个类到元素。然后单击检查以查看存在的类,然后据此决定您的操作。

<script>
  $(document).ready(function() {  
    $('.thumb a').on('click', function(e) {
      e.preventDefault();
      var $img = $(this).find('img'),
          $idshow = $(this).attr("id"),
          $action = 'add';

      if($img.hasClass('thumbsUp')){
         $action = "remove";
         $img.removeClass('thumbsUp');
      }else{
        $img.addClass('thumbsUp');
      }

     $img.attr('src', function(_,s) { return s.indexOf('thumbs_up_green') > -1 ? '../images/thumbs_up.png' : '../images/thumbs_up_green.png'});
     $.get("thumb_up_tip.php?tip_id=" + $idshow + "&action=" + $action)      
   });
   });
</script> 

它会检查元素上是否存在一个类,如果是,这已经是竖起大拇指,所以我们应该删除,反之亦然。

于 2013-08-05T02:20:38.130 回答