动态DOM创建问题

函数不会附加到新创建的输入框中。请检查我的代码此链接动态DOM创建问题

[请检查验证码] [1]

$("#datepicker").datepicker(); 
 

 

 
$("button").click(function(){ 
 
    
 
    $(".add").html('<input id="datepicker" placeholder="click here to open calendar " type="text" />'); 
 
    
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='add'><input id="datepicker" placeholder="click here to open calendar " type="text" /></div> 
 
<button>Add input again </button>

depen.io/anon/pen/adLzi

来源

2014-09-30 Vis

请包括相关的（[MCVE（http://stackoverflow.com/help/mcve））代码在这里，在你的问题。不要期望人们通过互联网上的链接来获得帮助。 – 2014-09-30 10:06:31

$("button").click(function(){ 

    $(".add").html('<input id="datepicker" placeholder="click here to open calendar " type="text" />'); 

    // move to here your cod 
    $("#datepicker").datepicker(); 

});

上$（“。add”）。html（...）表示删除并创建新的DOM对象

然后失去意义$（“＃datepicker”）。datepicker（）;

来源

2014-09-30 10:03:54 easywaru

我必须替换content.Not append。 – Vis 2014-09-30 10:05:01

多数民众赞成好..但为什么这个功能没有得到与我们添加使用JavaScript的InputBox附加？ – Vis 2014-09-30 10:11:53

你想要什么？使用datepicker？ – easywaru 2014-09-30 10:14:09

试试这个

$("button").click(function(){ 
    $("#datepicker").val(""); 
    $("#datepicker").focus(); 
});

Demo

来源

2014-09-30 10:06:59 Sadikhasan

当你点击按钮，这是正在执行的代码：

$("button").click(function(){ 
    $(".add").html('<input id="datepicker" placeholder="click here to open calendar " type="text" />'); 
});

这里做的事情是用新的替换日期选择器。除了附加事件重新附加问题外没有任何问题。

TL：DR，使用此代码：

$("button").click(function(){ 
    var el = $('#datepicker'); 
    $.datepicker._clearDate(el); 
});

编辑

即使我不知道确切的原因，为什么会这样，但是这可能是因为内部，jQuery UI的没有链接以前的DOM元素，它是悬挂的。这也会导致内存泄漏。

来源

2014-09-30 10:09:50 shash7

尝试插件初始化移动到您的document.ready功能：

$(document).ready(function() { 
$("#datepicker").datepicker();` 
});

$("button").click(function(){ 
 
    
 
    $(".add").html('<input id="datepicker" placeholder="click here to open calendar " type="text" />'); 
 
    
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='add'><input id="datepicker" placeholder="click here to open calendar " type="text" /></div> 
 
<button>Add input again </button>

来源

2014-09-30 10:32:25 MortenF

动态DOM创建问题

回答

相关问题