标签：voting javascript jquery

这是我第一次使用jquery并且我试图想要制作jquery remove(),只删除一个具有特定类的项,而不是每个具有相同类的项.

我的代码是这样的
jQuery的：

$(function() {

$(".vote").click(function() 
{
var id = $(this).attr("id");
var name = $(this).attr("name");
var dataString = 'id='+ id ;
var parent = $(this);
if (name == 'up') {
    $(this).fadeIn(600).html('<span class="glyphicon glyphicon-ok"></span>');
    $.ajax({
        type: "POST",
        url: "up_vote.php",
        data: dataString,
        cache: false,

        success: function(html) {
            parent.html(html);
            $(".vote").remove();
            $(".escondido").css("display", "block");

        }
    });
}

(代码继续以其他方式投票)

单击向上按钮后,jquery代码将删除包含类投票的按钮,但如果我有2个带有类投票的按钮,则两者都将被删除.我想删除单击的一个.任何想法怎么样？

<button type="button" class="btn btn-success btn-xs vote up" name="up" id="'.$reg['id'].'">BUTTON</button>

谢谢！

解决方法:

你需要在成功回调中使用点击范围添加对此的引用,然后jQuery就像你已经jQueried其他这样：

$(function() {

$(".vote").click(function() 
{
    var id = $(this).attr("id");
    var name = $(this).attr("name");
    var dataString = 'id='+ id ;
    var parent = $(this);
    var _this = this;
    if(name=='up')
    {
        $(this).fadeIn(600).html('<span class="glyphicon glyphicon-ok"></span>');
        $.ajax({
           type: "POST",
           url: "up_vote.php",
           data: dataString,
           cache: false,

           success: function(html)
           {
                parent.html(html);
                $( _this ).remove();
                $( ".escondido" ).css( "display", "block" );
           }  
        });
    }
});

作为奖励,这里有一个重构版本,可以节省一些cpu周期并使代码变得漂亮：

$(function() {

    $(".vote").click(function() 
    {
        var $this = $(this),
            id = $this.attr("id"),
            name = $this.attr("name"),
            dataString = 'id='+ id;

        if(name=='up')
        {
            $this.fadeIn(600).html('<span class="glyphicon glyphicon-ok"></span>');
            $.ajax({
                type: "POST",
                url: "up_vote.php",
                data: dataString,
                cache: false,

                success: function(html)
                {
                    $this.html(html);
                    $this.remove();
                    $( ".escondido" ).css( "display", "block" );
                }  
            });
        }
    });
});

标签：voting,javascript,jquery
来源： https://codeday.me/bug/20190824/1713223.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。