Javascript 根据时差向下滑动标签

所以我有两个时间域，

timeFrom

和

timeTo

。如果时差等于或大于2，我想做的是让标签向下滑动。但我不知道我做错了什么。这是我的密码：

$(document).ready(function() {
    $("#timeTo").change(function()) {
        var timeTo = $("#timeTo").val();
        var timeFrom = $("#timeFrom").val();
        var diff = timeTo - timeFrom;
        if (diff >= 2){
            $("#cost_label").slideDown();
        }
        else{
             $("#cost_label").slideUp();
        }
    });
    $("#cost_label").hide();
    $("#timeTo").trigger("change");
});

试一试

标签将在动画完成时隐藏，因此不会立即隐藏

字符串读取为整数，因为不能减去字符串

on（'input'）

而不是

on（change）

，这是检测文本字段更改的正确方法

删除了匿名函数声明后的括号，这是一个语法错误；） 您可以随时调试问题，并使用逻辑解决这些问题

---

如果您使用的是具有合理最小/最大限制的

type=“number”

输入，则可能不需要使用

+

来键入值，也可能不需要

Math.abs

。 当按键从下向上移动时，将触发

'keyup'

事件，因此您无需取消对输入框的对焦（单击或制表符）。如果您急于等待，并且不介意当用户在键盘上睡着时每14毫秒触发一次事件，您也可以使用

“keydown”

。 使用$.on而不是名为方法的事件，以便可以侦听多个事件（作为空格分隔的列表），并侦听两个输入上的事件（选择器需要逗号分隔的列表）

使用

input type=“text”

使用

input type=“number”

（可能不适用于所有浏览器）

---

这个“输入”事件是什么？我在jquery文档中找不到它

你在函数（）之后有一个额外的参数，也许这就是问题的一部分始终检查开发控制台是否有错误，当你有语法错误时，它会告诉你。哦，天哪。哈哈，不管怎样。“我的标签仍然不会显示：/另外，看起来“成本”标签是隐藏的，因此您不会看到它滑动。请尝试删除$（“#成本”标签”）。隐藏（）；首先，检查标签是否出现，然后滑动/向下我这样做，标签保持可见，直到我更改时间，它变为不可见，然后根本不重新出现。即使时差超过2小时。是的，这是一般的想法。我对它进行了一些调整，以实现我的目标。非常感谢你，既然你已经来了，还有什么要回去的吗？所以我可以在我的php页面上使用它？@AnujHari你的意思是什么？比如，我需要使用时差来计算价格。有没有一种简单的方法可以从javascript返回diff，这样我就可以在我的PHP页面中使用它

$(document).ready(function () {
    $("#timeTo").on('input', function () {
        var timeTo = $("#timeTo").val();
        var timeFrom = $("#timeFrom").val();
        var diff = parseFloat(timeTo) - parseFloat(timeFrom);
        alert(diff);
        if (diff >= 2) {
            $("#cost_label").slideDown({
                complete: function () {
                    $("#cost_label").hide();
                }
            });
        } else {
            $("#cost_label").slideUp({
                complete: function () {
                    $("#cost_label").hide();
                }
            });
        }
    });
});

$(function(){
    $('#cost_label').hide();
    $('#timeFrom,#timeTo').on('keyup change', timeChange);
    function timeChange(){
        var from = +$('#timeFrom').val();
        var to = +$('#timeTo').val();
        if(Math.abs(to - from) >= 2)
            $('#cost_label').slideDown();
        else $('#cost_label').slideUp();
    }
    timeChange();
});