【问题标题】:how to reset .one() without refreshing page如何在不刷新页面的情况下重置 .one()
【发布时间】:2013-06-04 18:19:42
【问题描述】:

我有一个提交按钮,我附加了一个.one() 鼠标事件,否则如果你不小心双击它会发送两次信息。

唯一的问题是,一旦发送信息,我刷新包含div(我不刷新整个页面),然后显示新信息。但是,如果您要添加更多信息,它将不允许您再次单击提交按钮,因为它已经被单击了。

我认为我正在刷新div,它会重置....但它没有。我该如何解决这个问题?

感谢

编辑

所以在乔伊的帮助下,我做到了。但它仍然会在双击时触发两次。我做对了吗?

    var clickActive = false;
$("body").on("click", '.post_comment_button', function(e){
        e.preventDefault();
        if(clickActive) return;
        else { 
        clickActive = true;
        var post = $(this).parents('.update_comment').parents('#post_comment');
        var anchor = $(post).siblings('.comment_list').find('ul:first');
        var comment = $(this).parents('.update_comment').children('textarea.post_comment').val();
        var user = $(this).parents('.update_comment').children('input.user').val();
        var msg_id = $(this).parents('.update_comment').children('input.message_id').val();
            if (comment == '')  loadComments();     
            else {
                $.post('messages.php', { 
                    comment: comment, 
                    message_id: msg_id, 
                    post_comment: 'true' }, function(data) {
                    //create new comment//  
                        $('body').append(data);
                        var newcomment = "<li><div class='comment_container'><div class='date'>less than 1 minute ago</div><div class='name'>" + user + " </div><div class='info_bar'><div class='edit_comment'><a href='#' class='comment_edit'>Edit</a></div><span>|</span><a href='#' class='delete_comment'>Delete</a></div><div class='fadeOut_comment'><div class='posted_comment'> " + nl2br(htmlEntities(comment.trim())) + " </div></div></li>";
                        $(post).slideUp(400);
                        $(newcomment).fadeIn(500, function() {
                            loadComments();
                        }).appendTo(anchor);
                        clickActive = false;
                });
            }
        }
});

【问题讨论】:

  • 在这里回答:stackoverflow.com/questions/11800611/… 如果你把一个事件放在一个函数中,它将再次起作用。
  • 我认为这个问题是重复的:stackoverflow.com/questions/11800611/…
  • 您不应该使用one(),而是使用on(),然后使用off() 来禁用按钮,直到内容更新。
  • 我读过这个问题,谢谢。我把它放在一个函数中......但它仍然无法正常工作,我如何在使用一次后调用该函数?
  • off() 相同的问题。我怎样才能让它让我再次开火?

标签: jquery ajax refresh partial-page-refresh


【解决方案1】:

另一种解决方案是禁用按钮,使用户无法连续单击两次。 使以下逻辑适应您的代码。

//Bind a click event handler to your button
$("body").on("click", "you_button_selector", function(e)
{
    //Prevent any default behaviour, we're dealing with this ourselves
    e.preventDefault();
    //First, disable the button
    $("your_button_selector").attr("disabled", "disabled");
    //Then, make your ajax call
    $.ajax(
    {
        url: "http://example.com",
        success: function(data)
        {
            //When your ajax call returns, enable the button again
            $("your_button_selector").removeAttr("disabled");
        }
    });
});

【讨论】:

  • 天才!完全有效。当我重新加载div 时,我什至不需要再次启用该按钮。谢谢老兄....或老兄
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-11-25
  • 2017-12-21
  • 2017-05-11
  • 2011-06-15
  • 2013-04-07
  • 2013-08-20
相关资源
最近更新 更多