Question

当我在脚本外的文本框中使用日期选择器时，它工作正常，看起来像这样。

<input type="text" id="entry_date" name="entry_date[]"  class="form-control datepicker" data-date-format="<?= config_item('date_picker_format'); ?>"  value=""/>

但是当我在脚本中使用相同的日期选择器功能时，它不起作用，我不知道它是否会像我给的那样工作。这是我的代码

<script type="text/javascript">
$(document).ready(function () {
 $(function () {    
        $("#datepicker1").datepicker();
    });

var maxField = 10; //Input fields increment limitation
var addButton = $('.add_button'); //Add button selector
var wrapper = $('.field_wrapper'); //Input field wrapper
var fieldHTML = '<div  class="form-group"><input  class="form-control date_pick datepicker col-lg-2" id="datepicker1" placeholder="yyyy-mm-dd" type="text" name="entry_date[]" value=""/></div>'; //New input field html 


var x = 1; //Initial field counter is 1
$(addButton).click(function(){ //Once add button is clicked
    if(x < maxField){ //Check maximum number of input fields
        x++; //Increment field counter
        $(wrapper).append(fieldHTML); // Add field html
    }
});

});
</script>

你可以向我解释我应该如何拨打这个日期选择器吗？

谢谢

Answer 1

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.min.js"></script>

<button class="add_button">Add</button>
	<div class="field_wrapper"></div>
	<script type="text/javascript">
		$(document).ready(function () {
			var maxField = 10; //Input fields increment limitation
			var addButton = $('.add_button'); //Add button selector
			var wrapper = $('.field_wrapper'); //Input field wrapper
			var fieldHTML = ''; //New input field html 
			var x = 1; //Initial field counter is 1

			$(addButton).click(function(){ //Once add button is clicked
			    if(x < maxField){ //Check maximum number of input fields
			        x++; //Increment field counter
			        fieldHTML = '<div  class="form-group"><input  class="form-control date_pick datepicker col-lg-2" id="datepicker' + x + '" placeholder="yyyy-mm-dd" type="text" name="entry_date[]" value=""/></div>';
			        $(wrapper).append(fieldHTML); // Add field html
			        $("#datepicker" + x).datepicker();
			    }
			});
		});
	</script>

＆＃13;

Answer 2

检查html是否正确附加，或者将html代码分别添加到jquery，也许最近在使用datepicker函数时使用jquery代码。

此致

在脚本中的文本框中使用的datepicker

2 个答案: