jQuery .wrap（）无需重新聚焦

Question

我需要用div包装输入，但是在.wrap（）输入模糊之后。如何修复？

<input type="text">

<script>
    $("input").on("keypress", function(){
        $(this).wrap("<div></div>");
    })
</script>

http://jsfiddle.net/n3W3W/

Answer 1

首先，解释发生了什么：

当你调用wrap时，jQuery正在从DOM中删除输入。它创建一个DIV元素，附加输入，然后重新附加到DOM。因为输入是从DOM中删除的，所以你会失去焦点。

解决此问题的最简单方法是在focus之后致电wrap。附加DIV元素后，jQuery将触发焦点input元素。

在这里小提琴：http://jsfiddle.net/2PgR8/

然而，这有评论中提到的user13500的问题。那个，输入元素不断地用DIV包裹。最终得到的结构如下：

<div>
    <div>
        <div>
            <div>
                <input></input>
            </div>
        </div>
    </div>
</div>

如果你键入＆＃34;很酷＆＃34; ...所以不是每个有效的：）

请问在DIV中包装输入的目的是什么？您 COULD 通过条件检查限制wrap，例如：

if($(this).data('is-wrapped') === undefined) {
    $(this).wrap('<div></div>').data('is-wrapped', true).focus();
}

如果你有要求......这就是小提琴！ http://jsfiddle.net/2PgR8/1/