Question

我有一个单元格<td>：

我在jquery中有一个脚本，当你双击它时，它会像这样创建一个<input type="text">：

$("td").dblclick(function(event){
        event.stopPropagation();
        if($(event.target).prop("id")!="inputeditar"){ //WHEN I DOUBLE CLICK IN THE CELL
        // I paste the value of the cell into the value of the input


            $(document).one("click",function(event2){ //IF I CLICK OUT OF THE INPUT
            if($(event2.target).prop("id")!="input")
                 {
                 $("#input").remove(); //THEN I REMOVE IT

                 }
        });
        }


});

因此，如果我双击单元格中的空格，则输入将从单元格中获取文本，如果我在输入外部单击，则它会消失。

它工作正常，但如果我点击输入（而不是外部），那么每当我点击它之外它就永远不会消失。我想继续检查我是否在外面点击，然后删除输入。

Answer 1

在事件处理程序中添加事件通常是一个坏主意，但你可以实现你想要的东西：

$(document).on("click",function(event2) { 
    if ($(event2.target).prop("id")!="input")
    {
        //IF I CLICK OUT OF THE INPUT
        //THEN I REMOVE IT
        $("#input").remove();
        $(document).off("click");
    }
})

然而 $(document).off("click")似乎是真的 坏主意！

根据KevinB关于命名事件处理程序的评论，您应该能够向事件处理程序添加命名空间并根据需要将其关闭：

$(document).on("click.removeinput",function(event2) { 
    if ($(event2.target).prop("id")!="input")
    {
        //IF I CLICK OUT OF THE INPUT
        //THEN I REMOVE IT
        $("#input").remove();
        $(document).off("click.removeinput");
    }
})

（但我个人从未使用过事件命名空间，所以看看它是怎么回事）

或者，您可以使用命名函数重新附加one()，例如：

..."dblclick".., function() { ...
    $(document).one("click", removeinput);


function removeinput(e) {
    if ($(e.target).prop("id")!="input")
    {
        //IF I CLICK OUT OF THE INPUT
        //THEN I REMOVE IT
        $("#input").remove();
    }
    else
       $(document).one("click", removeinput);
};

理解Jquery的执行

1 个答案: