3

我需要替换任意元素内的一部分文本。我对元素的结构一无所知，包括它可能具有的任何子元素，但我必须假设可能存在带有附加绑定的子元素。一个例子可能是：

<div id="checkit">
  Lorem ipsum textum checkum.
  <input type="button" id="clickit" value="Click Me" />
</div>

现在，如果我想用其他东西替换'ipsum'，我可以用innerHTML获取#checkit的内容，对其运行replace，然后用新文本设置它的innerHTML，但如果在#clickit上设置了绑定，更新 innerHTML 时，绑定将丢失。

我真的不需要或不想替换元素的整个 innerHTML，但我不确定如何替换元素中的部分文本。

所以我的问题是双重的：

  1. 关于如何替换#checkit 中的部分文本的建议
  2. 关于如何在不丢失绑定的情况下替换 innerHTML 的建议（或在#checkit 中保存绑定并在替换 innerHTML 后重新应用它们的方法）？
4

2 回答 2

4

关于如何替换#checkit 中的部分文本的建议

您可以使用这种方式仅替换文本内容而不会干扰其中的任何元素。

$('#checkit').contents().each(function(){
    if(this.nodeType===3) //select only the text nodes
    {
      this.nodeValue = this.nodeValue.replace(/u/g,'Z'); //replace all u with z
    }
});

演示

关于如何在不丢失绑定的情况下替换 innerHTML 的建议（或在#checkit 中保存绑定并在替换 innerHTML 后重新应用它们的方法）？

如果要替换innerHTML 并保持绑定不变，可以再次绑定事件或使用.on()jquery 中的事件委托。这样该事件就会附加到 DOM 中现在以及将来与选择器匹配的元素上，而无需再次绑定它们。

查看文档

于 2013-05-29T01:32:47.733 回答
0

解决问题的最佳方法是在另一个元素中添加文本并使用 Jquery 的 prev() 方法查找前一个元素 ....

您可以查看链接：

http://api.jquery.com/prev

HTML 代码：

<div id="checkit">
    <div >Lorem ipsum textum checkum.</div>
  <input type="button" id="clickit" value="Click Me" />
</div>

查询代码：

$ = jQuery.noConflict();
$("#checkit").delegate('#clickit' , 'click' , function(){
   $(this).prev().html('your text here..');
});

并且代码也在 jsfiddle 上创建：

http://jsfiddle.net/paragkuhikar/VxJBD/

请检查一下...

于 2013-05-29T01:57:57.520 回答