Javascript 在jQuery中计算日期差

问题是,；在我的应用程序中有两个字段，一个是日期（Field1），第二个是标签（Field2）。所以，我希望当用户选择字段1中的日期时，字段2应该自动填充（当前日期-字段1中的日期）。 有人能帮助我们实现它吗

我正在使用jQuery显示日期：

// This displays the date dialog when user clicks on Field1
$('#Field1').click(function () {
    $('#Field1').simpleDatepicker();
});

// Tried following code but it didn't worked
$('#Field1').click(function () {
    $('#Field1').simpleDatepicker({
        onSelect: function () {
       $('#Field2').value(calculateDays($('#Field1').toString))
        }
    });
});

function calculateDays(dateString) {
    var today = new Date();
    var inputDate = new Date(dateString);
    var days = today - inputDate;
    return days;
};

对于一些人来说，这可能看起来像是一个可怜的代码，但我只是一个初学者，所以欢迎任何建议/评论

---

另外，请告诉我，如果这可以做到只用html，而不需要去jQuery。我的理解是，计算天数（日期之间的差异）代码将出现在jQuery中，因为这需要在选择日期之后触发（“onSelect”事件）。如果有错误，请更正。

我不确定，但是：

$（'#Field2'）.value（calculateDays（$（'#Field1'）.toString））

应如下所示：

---

$（'#Field2'）.value（calculateDays（$（'#Field1'）.val（））

或

$（'#Field2'）.value（calculateDays（$（'#Field1'）.text（））

这是在第二个字段中设置相同日期的解决方案。 链接：

---

根据您的需要更改格式。

我假设您正在尝试使用（在Google上搜索“simpledatepicker”时，它排在首位）

正如Jimbo在评论中所说，这里很难对MVC方法提出建议——你说你想纯粹用HTML来实现这一点，但HTML本身不能支配行为（我认为这是非常不符合MVC的）。HTML5表单确实允许一些有限的行为控制（验证等），它们也提供

，但这些都无助于您的情况

因此，对于这个答案，我将修复代码中的错误：

这个插件是用

simpleDatePicker

jQuery方法初始化的-你忘了大写“P”

插件本身满足点击事件。您应该直接初始化它，而不必等待用户输入

源代码中没有

onSelect

初始化选项：我选择在输入上使用

change

事件监听器来捕获该选项

您使用jQuery方法

value

——这是原生DOM Javascript——您应该改用

val

toString

对DOM元素或jQuery对象不起作用-再次使用

val

方法

原生日期对象不能解析任意格式的日期，如果解析了，代码也不会产生天数（它只会产生毫秒的差异）。对于这种功能，您应该使用一个好的日期库：我选择了

结果代码（）：

关于我如何使用“时刻”的一些详细说明：

首先，我们要为实际的可量化日期对象解析

#Field1

的格式化日期：

moment(dateString,'MMM DD YYYY')

接下来，我们想从现在开始区分这一点。和Date一样，如果我们不通过任何论证，那么现在假设moment：

moment(dateString,'MMM DD YYYY').diff()

我们不希望将其作为日期，而是作为持续时间，因此我们将其传递给moment的

duration

方法：

moment.duration(moment(dateString,'MMM DD YYYY').diff())

…最后，我们希望以天表示：

moment.duration(moment(dateString,'MMM DD YYYY').diff()).days()

---

这与模型-视图-控制器范例有什么关系？这看起来像是一个只有jQuery的问题。@Jimbo注意，在没有任何其他框架的情况下使用jQuery并不一定排除使用MVC风格方法的可能性，因为人们可以在不同程度上分离关注点…@Barney注意到，这个问题与框架无关，也就是您所说的“MVC风格方法”，也没有任何设计模式。这仅仅是一个jQuery问题，并且已经被正确地重新标记为jQuery问题。任何不相关的东西都可能被删除（应该是这样的——我们在这里是为了保持所有相关的东西）。我还想指出，OP标记为and，以及。@Jimbo抱歉，并不是想批评。我认为示例代码的范围太简单，无法提供一个能够定性地满足“MVC”要求的答案。好吧。这可能是一个仅限于jquery的问题，但正如我所提到的，如果可以在html部分（MVC视图）而不是jquery中添加此选项，那么这些建议也会很有用。这是我添加了“mvc”标签的原因之一。您只需对此做一些小的更改。

moment.duration(moment(dateString,'MMM DD YYYY').diff()).days()