Javascript 更改事件jQuery中忽略的条件？

因此，我试图根据输入启用/禁用一个按钮，出于某种原因，我不知道为什么，它无法按我希望的方式执行

• 若输入值等于或介于1-10之间：启用按钮
• 若输入值小于1：禁用按钮

在更改输入值时，无论值是多少，按钮始终处于启用状态。如果该值设置为0，则不会禁用该值。 变量

inputIn

用于输入，变量

inputBtn

用于按钮，因此您知道在哪里查找

如果您注意到我还有什么需要修复的，请告诉我，因为我是jQuery和Javascript新手

更新：

通过将更改事件中的所有语句更改为if语句来解决问题。但不是最优的

$(document).ready(function() {
let $table = $(".shoe-table");

fetch("shoes.json")
.then(resp => resp.json())
.then(data => {
  let shoes = data.shoes;
  let rows = [1, 2, 3];
  let shoeCard = "";

  let counter = 0;
  rows.forEach(row => {
    shoeCard += "<tr>";
    for (let index = 0; index < 4; index++) {
      shoeCard +=
        "<td class='card text-center'>" +
        "<img class='card-img-top' src=" +
        shoes[counter].image +
        " alt='Card image cap'>" +
        "<h5 class='card-title'>" +
        shoes[counter].name +
        "</h5>" +
        "<p class='card-text'>kr " +
        shoes[counter].price +
        "</p>" +
        "<button id=" +
        counter +
        " class='orderNow btn btn-outline-dark'>ORDER NOW</button>" +
        "<div id=" + counter + " class='input-form'><input class='qty-chooser' type='number' placeholder='Choose quantity' min=0 max=10>" +
        "<button class='btn-add-to-cart' disabled='disabled'>ADD TO CART</button>" +
        "</div>" +
        "</td>";
      counter++;
    }

    shoeCard += "</tr>";
  });

  $table.append(shoeCard);
  let $inputForm = $(".input-form");
  let $orderBtn = $(".orderNow");

  $inputForm.hide();

  $orderBtn.click(toggleOrder);

  function toggleOrder() {
    let clickedBtn = $(this);
    let thisInputForm = $("#" + clickedBtn.attr("id") + ".input-form");


    let inputBtn = thisInputForm.children("button");
    let inputIn = thisInputForm.children("input");

    function resetInputForm() {
      inputBtn.css("background", "");
      inputBtn.css("color", "");
      inputBtn.attr("disabled", "disabled");
      inputIn.val(null);
    }

    inputBtn.click(function() {
      console.log("ADDING");
      thisInputForm.hide("slow");
      clickedBtn.text("ORDER NOW");
      clickedBtn.css("background", "");
      resetInputForm();
    });
     // The change function with conditions that do not work
    inputIn.change(function() {
      console.log("change");
      let qty = inputIn.val();
      if (qty >= 1 || qty <= 10) {
        inputBtn.removeAttr("disabled");
        inputBtn.css("background", "rgb(15, 163, 10)");
        inputBtn.css("color", "white");
      } else if (qty < 1) {
        resetInputForm();
      }
    });

    if (clickedBtn.text() == "CANCEL") {
      thisInputForm.hide("slow");
      clickedBtn.text("ORDER NOW");
      clickedBtn.css("background", "");
      resetInputForm();
    } else {
      thisInputForm.show("slow");
      clickedBtn.text("CANCEL");
      clickedBtn.css("background", "red");
      inputBtn.attr("disabled", "disabled");
      resetInputForm();
    }
  }
})
.catch(err => console.error(err));
});

$（文档）.ready（函数（）{
让$table=$（“.shoe table”）；
fetch（“shoes.json”）
.then（resp=>resp.json（））
。然后（数据=>{
让shoes=data.shoes；
设行=[1,2,3]；
让shoeCard=“”；
设计数器=0；
rows.forEach（row=>{
鞋卡+=”；
对于（让索引=0；索引<4；索引++）{
鞋垫+=
"" +
"" +
"" +
鞋子[柜台].姓名+
"" +
“
kr”+
鞋子[柜台].价格+
“
”+
“立即订购”+
"" +
“添加到购物车”+
"" +
"";
计数器++；
}
鞋卡+=”；
});
$table.append（shoeCard）；
设$inputForm=$（“.inputForm”）；
设$orderBtn=$（“.orderNow”）；
$inputForm.hide（）；
$orderBtn.单击（切换订单）；
函数toggleOrder（）{
单击Edbtn=$（此项）；
让thisInputForm=$（“#”+clickedBtn.attr（“id”）+“.InputForm”）；
让inputBtn=thisInputForm.children（“按钮”）；
让inputIn=thisInputForm.children（“输入”）；
函数resetInputForm（）{
css（“背景”，“背景”）；
css（“颜色”，“颜色”）；
输入BTN.attr（“禁用”、“禁用”）；
inputIn.val（空）；
}
inputBtn.click（函数（）{
控制台日志（“添加”）；
thisInputForm.hide（“慢”）；
点击btn.text（“立即订购”）；
单击edbtn.css（“背景”，“背景”）；
resetInputForm（）；
});
//在不起作用的条件下更改功能
inputIn.change（函数（）{
控制台日志（“更改”）；
让数量=inputIn.val（）；
如果（数量>=1 | |数量控制台错误（err））；
});

在代码中发现两个错误

html实体的id应该是唯一的。您正在向Div ordernow按钮证明相同的id

---

在change event中，您的条件应该是这样的：

qty>=1&&qty，所以我尝试在if-statements的change event中同时使用这两个条件。这似乎使它在某种程度上起作用，即使它不是最佳解决方案。现在的问题是，为什么两个独立的if语句都起作用，而else if语句不起作用，这就是else I的原因f语句不起作用？是的，因为根据您的语句，这是“如果（数量>=1 | |数量”