【发布时间】：2011-11-02 18:55:27
【问题描述】：
问题出在我无法添加 datepick();新创建项目的功能。
除此之外，一切都很好。
命名为 date1 和 datep1 的第一个元素具有 datepick 并且效果很好。
我在那里找到了插件：http://keith-wood.name/datepick.html 怎么了？
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="../../../includes/my_app/js/datepick/humanity.datepick.css" />
<script type="text/javascript" src="../../../includes/my_app/js/datepick/jquery.datepick.js"></script>
<script type="text/javascript" src="../../../includes/my_app/js/datepick/jquery.datepick-tr.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="../../../includes/my_app/js/datepick/ui-ui-lightness.datepick.css" />
<script>
$(function() {
$('#date1').datepick({
dateFormat: 'yyyy-mm-dd',
yearRange: '1800:2053'
});
});
$(function() {
$('#datep1').datepick({
dateFormat: 'yyyy-mm-dd',
yearRange: '1800:2053'
});
});
</script>
</head>
<body>
<form name="stad_alt" id="myForm">
<h1></h1>
<div id="first">
Please Select:
<select name="myoption">
<option value="1">First Option</option>
</select><br /><br /></div>
<div id="container">
<div id="input1" style="margin-bottom:4px;" class="alternate">
Name 1: <input type="text" name="the_name1" id="name1" class="textbox" />
From :<input type="text" id="date1" name="from1" class="textbox" />
To :<input type="text" id="datep1" name="to1" class="textbox" />
Photo: <input type="file" id="photo1" name="photo1" class="textbox" />
</div>
</div>
<div>
<input type="button" id="add" value="Add New" />
<input type="button" id="delete" value="Delete This" />
</div>
</form>
<script type="text/javascript">
$(function(){
var num = 1; //default 1
if (num == 1)
$('#delete').prop('disabled','disabled');
$('#add').live('click',function(e) {
e.preventDefault();
num = num+1;
$('#delete').prop('disabled','');
$('#date' + num).datepick({
dateFormat: 'yyyy-mm-dd',
yearRange: '1800:2053'
});
$('#datep' + num).datepick({
dateFormat: 'yyyy-mm-dd',
yearRange: '1800:2053'
});
var html = '<div id="input'+num+'" style="margin-bottom:4px;" class="alternate">Name '+num+': <input type="text" name="the_name'+num+'" id="name'+num+'" class="textbox" /> From :<input type="text" id="date'+num+'" name="from'+num+'" class="textbox" /> To :<input type="text" id="datep'+num+'" name="to'+num+'" class="textbox" /> Photo: <input type="file" id="photo'+num+'" name="photo'+num+'" class="textbox" /></div>';
$('#container').append('<div id="input'+num+'" style="margin-bottom:4px;" class="alternate">'+html+'</div>');
if (num == 10)
$('#add').prop('disabled','disabled');
});
$('#delete').click(function() {
$('#input' + num).remove();
num = num -1;
if (num == 1)
$('#delete').prop('disabled','disabled');
$('#add').prop('disabled','');
});
});
</script>
</body>
</html>
【问题讨论】：
-
在你传递给
live()的函数中添加console.log(num)。我怀疑这是一个范围问题，num每次都被重置，所以总是等于1（你已经有了#date1和#datep1元素，所以日期选择器将简单地重新附加到这些元素上） . -
尝试将
num移动到全局范围内（将其放在<script type="text/javascript">之后，$(function(){之前） -
它已经存在了吗？确定你读过代码吗？
-
将
var num = 1;移动到之前$(function(){，此时它是之后它。 -
标签： jquery ajax jquery-ui jquery-ui-datepicker