-1

为什么这不能正常工作?

无论您输入什么值,它总是返回“无效的票证类型”

function start() {
  var TickType;
  TickType = document.getElementById("TicketType").value;
  TickType = String(TickType);
  var TicketQty = document.getElementById("TicketQty").value;

  if (TickType != "A" || TickType != "B" || TickType != "C") {
    document.getElementById("msg").innerHTML = "Invalid Ticket Type";
  }

  if (isNaN(TicketQty)) {
    document.getElementById("msg").innerHTML = "Non numeric qty has been entered";
  }

  if (TicketQty < 1 || TicketQty > 100) {
    document.getElementById("msg").innerHTML = "Qty is outside valid range";
  }
}
<h1>Ticket Sales</h1>
<p>Enter the ticket type (A, B or C)</p>
<input type="text" id="TicketType">

<p>Enter the quantity required (1-100)</p>
<input type="text" id="TicketQty">

<p>
  </br>
</p>

<button onclick="start()">Click me</button>
<p id="msg"></p>

4

5 回答 5

1

使用&&代替||

if (TickType != "A" || TickType != "B" || TickType !=  "C"){
    document.getElementById("msg").innerHTML = "Invalid Ticket Type";
}

解释

TickType = "A",TickType != "B"TickType != "C"条件为真。

这里的两个条件总是true,所以它进入if语句

注意:在变量和value=""字段中添加 trim 和 parseInt 并在测试前清空消息

function start() {
  var TickType = document.getElementById("TicketType").value.trim();
  var TicketQty = parseInt(document.getElementById("TicketQty").value, 10);
  document.getElementById("msg").innerHTML = "";

  if (TickType != "A" && TickType != "B" && TickType != "C") {
    document.getElementById("msg").innerHTML = "Invalid Ticket Type";
  }

  if (isNaN(TicketQty)) {
    document.getElementById("msg").innerHTML = "Non numeric qty has been entered";
  }

  if (TicketQty < 1 || TicketQty > 100) {
    document.getElementById("msg").innerHTML = "Qty is outside valid range";
  }
}
<h1>Ticket Sales</h1>
<p>Enter the ticket type (A, B or C)</p>
<input type="text" id="TicketType" value="" />

<p>Enter the quantity required (1-100)</p>
<input type="text" id="TicketQty" value="" />

<p><br/></p>

<button onclick="start()">Click me</button>
<p id="msg"></p>

于 2017-04-20T05:48:59.817 回答
1

让我们试着弄清楚为什么它不能正常工作

您希望TickTypeAorBC。现在,当您评估以下条件时,可以说TickType="A"

if (TickType != "A" || TickType != "B" || TickType !=  "C"){
  • TickType != "A"将产生false,因为它是平等的。
  • 但是然后TickType != "B"true按原样TickType产生A而不是B

if找到匹配的条件并将 innerHTML 设置为"Invalid Ticket Type"


现在正确的条件是如果它不在任何一个值中,即

if (TickType != "A" && TickType != "B" && TickType !=  "C"){

现在这将起作用,但是如果您将来说 10 个这样的字符怎么办,添加 10 个这样的&&条件会降低代码的可读性。


备择方案

  1. 创建一个具有所有这些可能性的数组并检查索引。

var possibilities = ["A", "B", "C", "D", "E"];

function isAvailable(c){
  return possibilities.indexOf(c) > -1
}

console.log(isAvailable("G"))
console.log(isAvailable("A"))

  1. 创建一个正则表达式并测试有效性:

var possibilities = /(A|B|C|D|E)/

function isAvailable(c){
  return possibilities.test(c)
}

console.log(isAvailable("G"))
console.log(isAvailable("A"))

于 2017-04-20T05:55:01.583 回答
1

问题就在这里...

if (TickType != "A" || TickType != "B" || TickType !=  "C"){
    document.getElementById("msg").innerHTML = "Invalid Ticket Type";
}

即使您输入了 A、B、C 中的任何一个,此条件的计算结果始终为真。例如,你输入一个 A,第一个不等式失败,这没关系,但其他所有都会成功,你会得到“无效票”。

逻辑说:

!(A || B || C) <-> !A && !B && !C

所以将 if 条件更改为:

if (TickType != "A" && TickType != "B" && TickType !=  "C"){
   document.getElementById("msg").innerHTML = "Invalid Ticket Type";
}

这可以解决问题...如果 TickType 中的任何一个是 A 或 B 或 C,则 ands 将失败,您将不会得到“无效票证”

于 2017-04-20T06:05:57.163 回答
0

试试下面的代码。

if (TickType != "A" && TickType != "B" && TickType !=  "C")
于 2017-04-20T05:48:49.283 回答
0

您需要使用AND而不是OR状态。在哪里,您正在检查 TicketType 是否不是 A、B 和 C 之一。所以条件将是

if (TickType != "A" && TickType != "B" && TickType !=  "C")
{
    document.getElementById("msg").innerHTML = "Invalid Ticket Type";
}
于 2017-04-20T05:50:54.090 回答