javascript - .replace() 用新的 DOM 元素替换任意文本

Question

我在 div 中有一 block 未标记的文本。我想解析文本并用包含处理程序的新表单元素替换某些关键字。一个例子是，当我看到文本“日期:________”时，我想将其替换为新的输入字段，为其指定一个唯一的 id，然后为其附加一个 .datepicker() 处理程序。

给定示例文本:

*Lorem ipsum dolor sat amet，consectetur adipiscing elit，sed do eiusmod tempor incididunt ut Labore et dolore magna aliqua。日期:________ UT enim ad minim veniam，quis nostrud exeritation ullamco labouris nisi ut aliquip ex ea commodo consequat。 *

我尝试过以下方法:

$("#textdiv").replace(/Date:________/g, "<input type='text' id='textid_123'/>");  
$("#textid_123").datepicker();  

当它创建输入框时，它不会附加 datepicker() 处理程序。这并不让我感到惊讶，我猜测 JQuery 不知道 DOM 修改。

如果我的“日期”包含在一个或另一个标签中，这将是微不足道的。有没有办法用 JQuery 可见的新 DOM 元素替换纯文本？

Answer 1

未捕获的类型错误:$(...).replace 不是函数。

您应该替换元素的innerHTML，如下所示:

$("#textdiv").html( 
   $("#textdiv").html().replace(/Date:________/g, "<input type='text' id='textid_123'/>") 
); 

console.log( $('#textid_123') );  // yup, it's there, so .datepicker should work

顺便说一句:您在正则表达式中使用 /g 标志，这意味着您希望替换 Date: ___ 的多个实例。在这种情况下，您不应在新输入元素上使用硬编码的 id，因为 id 必须是唯一的。

http://jsfiddle.net/hfxvoL56/