jquerythis（）问题

我一定是做了些傻事，但我真的搞不懂，为什么这个脚本不是控制台。记录

标记中的文本

HTML:

显示名称：
它所在的房间

jQuery：

if ($('span.edit').length > 0) {
    $(this).click(function(){
        var elem = $(this).prev();
        var text = elem.text();
        console.log(text);
        elem.html('<input type="text">' + text + '</input>');
    });
}

if（$（'span.edit'）。长度>0）{
$（此）。单击（函数（）{
var elem=$（this.prev（）；
var text=elem.text（）；
console.log（文本）；
元素html（“”+文本+“”）；
});
}

JavaScript没有块范围；你期望这是什么

固定的：

if ($('span.edit').length > 0) {
    $('span.edit').click(function(){
        var elem = $(this).prev();
        var text = elem.text();
        console.log(text);
        elem.html('<input type="text" value="' + text + '" />');
    });
}

if（$（'span.edit'）。长度>0）{
$（'span.edit'）。单击（函数（）{
var elem=$（this.prev（）；
var text=elem.text（）；
console.log（文本）；
elem.html（“”）；
});
}

---

编辑：更新了

html（）

内容以纠正输入错误

我的猜测是

此

应该是指

span.edit

选择器

事实并非如此

您不需要检查

span.edit

是否有长度。如果没有匹配项，单击事件将不会绑定到任何元素

因此，您的代码可以简化如下：

$("span.edit").click(function(){
     var elem = $(this).prev();
     var text = elem.text();
     console.log(text);
     elem.html('<input type="text">' + text + '</input>');
});

$（“span.edit”）。单击（函数（）{
var elem=$（this.prev（）；
var text=elem.text（）；
console.log（文本）；
元素html（“”+文本+“”）；
});

因为这不是指跨度。但是，在以下代码中，它将绑定到跨度：

$（'.edit'）。单击（函数（）{
var elem=$（this.prev（'p'）；
var text=elem.text（）；
元素html（“”+文本+“”）；
});

---

此外，您不必检查长度，因为跨距始终显示在页面上（至少在小提琴中）。此外，如果它不存在，事件就不会被绑定。

如果不存在这样的元素，

if

语句是不必要的，那么单击处理程序什么也不做。如果将处理程序放入

，则不会更改
此
的范围以匹配该元素。直接瞄准
：

$('span.edit').click(function(){
    var elem = $(this).prev();
    var text = elem.text();
    console.log(text);
    elem.contents().unwrap().wrap('<input type="text">');
});

$（'span.edit'）。单击（函数（）{
var elem=$（this.prev（）；
var text=elem.text（）；
console.log（文本）；
元素内容（）.unwrap（）.wrap（“”）；
});
代码中的这个
是什么？哦，嗯，我想应该是$（'span.edit），这可能是我的问题。有没有想过为什么我输入的结束标记没有进入我的html？@watson-输入没有结束标记？谢谢@nbrooks；固定的。我们都知道，我知道。该再来一杯咖啡了！
$('.edit').click(function(){
    var elem = $(this).prev('p');
    var text = elem.text();
    elem.html('<input type="text">' + text + '</input>');
});

$('span.edit').click(function(){
    var elem = $(this).prev();
    var text = elem.text();
    console.log(text);
    elem.contents().unwrap().wrap('<input type="text">');
});