首页 > jquery如何让用户只允许按钮点击一次?

jquery如何让用户只允许按钮点击一次?

http://jsbin.com/kinaqoyawe/edit?html,css,js,output

$(".radius-nice").click(function(){
    $(this).addClass("on");
    var add=$(".num-add").text();
    add++;
    $(".num-add").text(add);
    return false;
});

怎么在原有基础上添加一些只接受用户单击一次?
我想让用户允许点赞一次。之后就不能再单击了。请问怎么写?


这个需要服务端的 和 前端配合才能实现

1.用户点击按钮后 立即 禁用该按钮 disabled  属性,但这个禁用了
用户刷新页面 还是会再次点击的
2.服务端去数据库验证,用户是否已经点赞,页面渲染的时候 直接disabled 就行
去执行点赞的数据库操作的时候,先去验证是否已经赞过了就行


简单的设置cookie吧,如果cookie存在不允许点击


$(".radius-nice").click(function(){
    if($(this).hasClass('on')) {
        return;
    }
    $(this).addClass("on");
    var add=$(".num-add").text();
    add++;
    $(".num-add").text(add);
    return false;
});

http://www.w3school.com.cn/jquery/event_one.asp

$(".radius-nice").one("click", functin() { ... });

当然这样做用户刷新了页面后还是可以再点一次的。要想让用户刷新页面后还不能继续点,要通过后台判断,jQuery做不了了。


您可以使用这个方法:

$("p").one("click", function(){
  alert( $(this).text() );
});

为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数。


这个要看你需求。
如果单次刷新页面只能点击一次的话可以进行计数方式。隐藏一个保存值进行修改值即可。也可以直接btn事件的删除。也可以替换标签。
如果只能点一次必须服务端保存状态。刷新页面进行判断用户是否进行点击过。

最后可以小建议可以看下Vue js。数据的双向绑定可以学一下看看它的是这么实现的。

【热门文章】
【热门文章】