与 jquery 比较 2 次

Question

提前感谢您的帮助...

我正在尝试 (1) 生成表单的开始时间和结束时间，(2) 找到两者之间的差异，以及 (3) 将差异添加到新输入中。

这是我目前所拥有的：

<a href="#" id="starttime">Begin time</a>
<input id="starttimeinput" name="starttimeinput" type="text" value="">
<script>
    $("#starttime").click(function () {
         var begintime = event.timeStamp;
         $("#starttimeinput").val(begintime);
    });
</script>
<a href="#" id="endtime">end time</a>
<input id="endtimeinput" name="endtimeinput" type="text" value="">
<script>
    $("#endtime").click(function () {
         var endtime = event.timeStamp;
         $("#endtimeinput").val(endtime);
    });
</script>
<input id="totaltime" name="totaltime" type="text">
<script>
    $("#totaltime").focus(function () {
       var begintime = $("#starttimeinput").val();
       var endtime = $("#endtimeinput").val();
       var totaltime = endtime - begintime;
       $("#totaltime").val(totaltime); 
     });     
</script>

第一部分起作用（将时间戳输入到开始时间和结束时间输入中）。我以前从未使用过数字，也无法弄清楚第二部分。出现的结果是“NaN”。

这可能有助于了解点击链接之间的时间应该在 30 秒左右...

非常感谢你们在我不必发帖的情况下回答了我这么多问题的任何帮助！

Answer 1

您需要parseInt() 将时间返回，否则它们只是字符串（由.val() 返回）。

$("#totaltime").focus(function () {
    var begintime = parseInt($("#starttimeinput").val(), 10),
        endtime = parseInt($("#endtimeinput").val(), 10),
        totaltime = endtime - begintime;
    $("#totaltime").val(totaltime); 
 });

---

就个人而言，我宁愿自己存储begintime 和endtime 值，而不是在文本输入中（为什么用户需要查看它们呢？）。像这样：

var begintime,
    endtime;
$("#starttime").click(function (event) {
     begintime = event.timeStamp;
     //$("#starttimeinput").val(begintime);
});

$("#endtime").click(function (event) {
     endtime = event.timeStamp;
     //$("#endtimeinput").val(endtime);
});

$("#totaltime").focus(function () {
    $("#totaltime").val(endtime - begintime); 
});

---

附带说明，我建议将您的 jQuery 代码从内联 <script> 标记中移出并移到外部 JS 文件中。这使得标记和 JS 更易于维护。只需将所有 JS 代码包装在文档就绪处理程序中即可：

$(document).ready(function () {
    /* your code here */
});

或者，更简洁地说，

$(function () {
    /* your code here */
});