javascript 如何使用javascript动态添加日历文本框?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10280238/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add calendar text box dynamically using javascript?
提问by Raj
I have to add a calendar text box dynamically on each click on a link. I have tested some codes. For the first declaration it works and not for the others. Here's my code:
每次单击链接时,我都必须动态添加日历文本框。我测试了一些代码。对于第一个声明,它有效,而不适用于其他声明。这是我的代码:
<head>
<script type="text/javascript">
$(function () {
$(".hajanDatePicker").datepicker();
});
</script>
<script type="text/javascript">
var intTextBox=0;
function addElement(){
var contentID = document.getElementById('content');
var newTBDiv = document.createElement('div');
newTBDiv.setAttribute('id','txtDatePicker');
newTBDiv.innerHTML +="Date:<input id='txtDatePicker' type='text' name='test1'>";
contentID.appendChild(newTBDiv);
}
</script>
</head>
<body>
<form id="form1" method="get">
<div id="content">
<input type="text" id="txtDatePicker" name="test1"/>
</div>
<p><a href="javascript:addElement();" >Add</a>
</form>
</body>
When the form loads can get the calender. After clicking "Add" it just opens as a normal text box and not as calendar.
当表格加载时可以得到日历。单击“添加”后,它只是作为普通文本框而不是日历打开。
回答by Jakub Konecki
Just call
打电话就行
$(".hajanDatePicker").datepicker();
at the bottom of addElement
function.
在addElement
函数的底部。
And change
并改变
<input id='txtDatePicker' type='text' name='test1'>
<input id='txtDatePicker' type='text' name='test1'>
to
到
<input id='txtDatePicker' type='text' class='hajanDatePicker' name='test1'>
<input id='txtDatePicker' type='text' class='hajanDatePicker' name='test1'>
Also, you have multiple inputs on your page with the same id: txtDatePicker.
此外,您的页面上有多个具有相同 ID 的输入:txtDatePicker。