我正在尝试用包含输入值的跨度替换输入,以便能够在单击按钮时将其切换回来.我认为这最容易分两个阶段完成 – 添加< span> [输入值]< / span>在输入前面,然后隐藏输入.唯一的问题是我在第一部分遇到了麻烦.我正在尝试这样的事情
$('#container').find('input')
.parent()
.prepend('<span></span>') // this effectively creates: <span></span><input value=____>
但是,在prepend语句里面$(this)似乎是未定义的,所以我不能这样做
.prepend('<span>'+$(this).children('input').val()+'</span>')
由于有几个输入,我不能简单地将输入值放入变量中.我该怎么办？
解决方法
对于更新的问题：
你可以这样做(基于评论,每行编辑)：
$('input',context).each(function() {
$("<span />",{ text: this.value,"class":"view" }).insertAfter(this);
$(this).hide();
});
You can view a more detailed demo here,with per-row edit toggling.
对于原始问题：
您将要使用.replaceWith()：
$('#container').find('input').each(function() {
$(this).replaceWith("<span>" + this.value + "</span>");
});
.each()创建一个闭包,其中this引用input元素,因此您可以使用this.value作为示例.
为了确保编码得到处理,请将其展开一些以使用.text(),如下所示：
$('#container').find('input').each(function() {
$(this).replaceWith($("<span />").text(this.value));
});
