Javascript 使用Jquery比较两个输入值

我试图比较双输入范围滑块中的两个值。如果底部值等于或大于顶部值，我想返回

false

。这是为了防止两个拇指重叠

我使用

.change

来监听更改。然后我可以

console.log

&在更新后返回值。我已经包含了最后一段代码，希望能得到帮助。您可以在此处看到一个完整的几乎正常工作的版本：

谢谢

$("input[type='range'][id='text_box_bottom_range']").change(function() {
  var bottom = $("input[type='range'][id='text_box_bottom_range']").val();
  console.log("bottom = " + bottom);
  return bottom;
});

$("input[type='range'][id='text_box_top_range']").change(function() {
  var top = $("input[type='range'][id='text_box_top_range']").val();
  console.log("top = " + top);
  return top;
});     

$("input").blur(function() {
  if ($("input[type='range'][id='text_box_bottom_range']").val() > this.val) {
    console.log("Bottom is higher than Top");
    return false;
  } else { 
  return true; 
  }
});

这条线

if ($("input[type='range'][id='text_box_bottom_range']").val() > this.val) {

应该是

if ($("input[type='range'][id='text_box_bottom_range']").val() > $("input[type='range'][id='text_box_top_range']").val()) {

这条线

if ($("input[type='range'][id='text_box_bottom_range']").val() > this.val) {

应该是

if ($("input[type='range'][id='text_box_bottom_range']").val() > $("input[type='range'][id='text_box_top_range']").val()) {

---

将输入元素上的模糊事件更改为

$("input").blur(function() {
  if ($('#text_box_bottom_range').val() >= $('#text_box_top_range').val()) {
    console.log("bottom is equal or higher than the top");
    return false;
  } else { 
    return true; 
  }
});

---

将输入元素上的模糊事件更改为

$("input").blur(function() {
  if ($('#text_box_bottom_range').val() >= $('#text_box_top_range').val()) {
    console.log("bottom is equal or higher than the top");
    return false;
  } else { 
    return true; 
  }
});

这将正确检查底部位置：

…等于或大于最大值

另外，前两个函数（

.change（）

）对于您试图实现的目标来说是相当多余的，但我已经介绍了一种更好的编写它们的方法

这将正确检查底部位置：

…等于或大于最大值

---

另外，前两个函数（

.change（）

）对于您试图实现的目标来说是相当多余的，但我已经提供了一种更好的方法来编写它们

当然，这些选择器是多余的-您可以简单地使用：var bottom=$（“#text#box_bottom_range”）.val（）；当然，这些选择器有些过分——您可以简单地使用：var bottom=$（“#text_box_bottom_range”）.val（）；