我在div中有一块未标记的文本。我想解析文本,并用包含处理程序的新表单元素替换某些关键字。一个例子是,当我看到文本"Date:________"时,我想用一个新的输入字段替换它,给它一个唯一的id,然后给它附加一个.datepicker()处理程序。
给定示例文本:
*Lorem ipsum dolor坐amet,consectetur adipiscing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua。日期:________ Ut enim ad minim veniam,quis nostrud exerciation ullamco labours nisi Ut aliquip ex ea commodo consequat。*
我尝试过以下几种:
$("#textdiv").replace(/Date:________/g, "<input type='text' id='textid_123'/>");
$("#textid_123").datepicker();
当它创建输入框时,它不附加datepicker()处理程序。这并没有让我感到惊讶,我猜JQuery并没有意识到DOM的修改。
如果我的"Date"被包装在一个或另一个标签中,这将是微不足道的。有没有办法用JQuery可见的新DOM元素替换纯文本?
Uncaught TypeError: $(...).replace is not a function
。
您应该替换元素的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
BTW:您在正则表达式中使用/g
标志,这意味着您希望替换多个Date: ___
实例。在这种情况下,您不应该在新的输入元素上使用硬编码的id
,因为id必须是唯一的。
http://jsfiddle.net/hfxvoL56/
问题不在于jQuery没有接收到内容更改,因为内容在.datepicker
调用之前已经更改。问题是.replace()
不是一个有效的jQuery方法。相反,替换HTML内容如下:
var content = $("#textdiv").html().replace(/Date:________/g, "<input type='text' id='textid_123'/>");
$("#textdiv").html(content);
然后您可以调用其他方法。示例JSFiddle