javascript - 如何在单击时结束 jquery 函数

标签 javascript jquery jquery-plugins slug

我目前使用 jQuery slug 插件创建一个基于标题框的项目 slug。这很好用。我正在做的事情只是在用户单击编辑链接时更新 slug。现在当编辑链接被调用时,slug 功能被启动并且工作正常但是当“完成”链接被点击时我需要找到一种方法来关闭 slug 功能。我希望这是有道理的。

    $('#edit_slug').click(function() {
    //allow user to edit the project slug
    $("#edit_project_name").stringToSlug({  //this is the slug plugin
        getPut: '.project_slug',
        hide: false
    });
    $('input.project_slug').show(); //show the input
    $('input.project_slug').next("span").remove().end(); //remove the span with the slug
    $('#edit_slug').hide(); //hide edit link
    $('input.project_slug').after(" <a href='#' id='done_edit_slug'>Done</a>"); //show done link 
});

//if the user is done editing the slug show the span with the slug in it
$('#done_edit_slug').live('click', function() {
        $("#edit_project_name").stringToSlug().end(); //my attempt to make the function end
        $('input.project_slug').after("<strong><span>"+$('input.project_slug').val()+"</span></strong>"); //show the slug as a span
        $('input.project_slug').hide(); //hide the input box
        $('#done_edit_slug').remove().end(); //remove done link
        $('#edit_slug').show(); //show edit link


});

我不确定这是完成此任务的最佳方式,我对想法持开放态度。主要是我不确定如何在单击 #done_edit_slug 时结束 stringToSlug() 函数。

谢谢!

最佳答案

在您完成的事件处理程序中尝试取消绑定(bind)您的文本框上的事件。

$('#done_edit_slug').live('click', function() {
        $("#edit_project_name").unbind("keyup keydown blur");
        $('input.project_slug').after("<strong><span>"+$('input.project_slug').val()+"</span></strong>");
        $('input.project_slug').hide();
        $('#done_edit_slug').remove().end(); 
        $('#edit_slug').show();
});

这是在假设您使用插件源中的默认事件的情况下完成的。

关于javascript - 如何在单击时结束 jquery 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5130573/

相关文章:

java - 将javascript对象数组作为参数发送到 Controller

javascript - 不确定如何设计使用 XML 创建 HTML 对象的 JavaScript/jQuery 功能

jQuery 自动完成插件不聚焦下一个单击的字段

javascript - selectBox 中的 jquery 移动选项未正确呈现

asp.net-mvc - jQuery Validation 1.9 在 IE9 中不起作用

javascript - 如何更改缩放系数以仅缩小 Ken Burns 效果?

javascript - 如何将日期选择器设置为 fiddle 中的文本框?

javascript - 尝试使用 jquery 和 ajax 填充下拉列表

javascript - 如何构建一个嵌入变量值的字符串?

jquery - 使 Bootstrap 3 选项卡响应式