如果/ Else jQuery：else语句不起作用

Question

此jQuery代码中的 else 语句无效。我已经尝试将if / else语句放入一个函数中（在通过Stackoverflow解析之后），但是我无法让它工作。你对这个问题有什么看法吗？这是语法错误吗？

这是一个link to the Fiddle。

的jQuery

$( "button" ).click(function() {
    myAnswer();
  });

 $( "input" ).change(function() {
    myAnswer();
 });     

function myAnswer () {
    $(".pick").removeClass('my-display').addClass('my-no-display');
    var myPick = $("input").val();
    function myFinalAnswer () {
        if (myPick == "ram","mary","jon","shyam","shannon","tate","quy","sanjay") {
            var myString = "." + myPick; 
            var myFinalPick = myString.toLowerCase();
            $( myFinalPick).removeClass('my-no-display').addClass('my-display'); 
        }
        else {
            $(".none").removeClass('my-no-display').addClass('my-display');
        }
    }
    myFinalAnswer();
}

HTML

<div class="container">
<div class="row">
    <div class="col-xs-12 top-line">
        <h2>Who will win the Game of Thrones?</h2>
    </div>
</div>
<div class="row">
    <div class="col-xs-12 my-choices">
        <p>Ram, Jon, Shyam, Shannon, Tate, Quy, Mary, or Sanjay?</p>
    </div>
</div>
<div class="row">
    <div class="col-xs-8 my-input">
        <input type="text" onfocus="if(this.value == 'Take your best guess!') { this.value = ''; }" placeholder="Take your best guess!" />
    </div>
    <div class="col-xs-4 my-button">
        <button class="submit-button">
            Submit
        </button>   
    </div>
</div>      
<div class="row">
    <div class="col-xs-12 my-answer">
       <span class="mary pick my-no-display">We all love the walk of shame.</span>
        <span class="jon pick my-no-display">Isn't he too busy with tindr?</span>
        <span class="shyam pick my-no-display">We always knew his fingers were little.</span>
        <span class="shannon pick my-no-display">Because that's where a Khaleesi belongs.</span>
        <span class="tate pick my-no-display">Ramsey? Ewww.</span>
        <span class="quy pick my-no-display">What she said.</span>
        <span class="ram pick my-no-display">So into it!</span>
        <span class="sanjay pick my-no-display">Another Lannister?</span>
        <span class="none pick my-no-display">This is a terrible idea.</span>
    </div>          
</div>
</div>

Answer 1

使用jQuery，您可以使用inArray函数检查某个值是否在给定数组上，对于示例：

var myArray = ["ram","mary","jon","shyam","shannon","tate","quy","sanjay"];

if ($.inArray(myPick, myArray))
{
 // .. code 
}

Answer 2

将您的if声明更改为

if (["ram","mary","jon","shyam","shannon","tate","quy","sanjay"].indexOf(myPick) > -1)

在if语句中多次应用相同的条件不能通过逗号分隔。在这种情况下，您可以使用indexOf，如果数组中不存在-1将返回$("button").click(function() { myAnswer(); }); $("input").change(function() { myAnswer(); }); function myAnswer() { $(".pick").removeClass('my-display').addClass('my-no-display'); var myPick = $("input").val(); function myFinalAnswer() { if (["ram", "mary", "jon", "shyam", "shannon", "tate", "quy", "sanjay"].indexOf(myPick) > -1) { var myString = "." + myPick; var myFinalPick = myString.toLowerCase(); $(myFinalPick).removeClass('my-no-display').addClass('my-display'); } else { alert("Hello else."); $(".none").removeClass('my-no-display').addClass('my-display'); }; } myFinalAnswer(); }。

＆＃13;

＆＃13;

body {
  font-size: 16px;
}
input {
  height: 40px;
  width: 100%;
  padding-left: 10px;
  color: grey;
  margin-left: 13px;
}
.top-line {
  text-align: center;
}
.my-choices {
  text-align: center;
  margin-bottom: 5px;
}
.my-input {
  text-align: center;
}
.my-answer {
  padding: 10px;
  border: 1px solid red;
  border-radius: 5px;
  margin: 8px 27px;
  width: 91%;
  height: 150px;
  line-height: 1.7;
  background-color: black;
  color: white;
  font-weight: 600;
}
.my-answer {
  text-align: center;
}
.my-button {
  text-align: center;
  line-height: 2;
}
.submit-button {
  padding: 3px 12px;
  margin-bottom: 0px;
  font-size: 16px;
  line-height: 26px;
  font-family: #A52A2A;
  font-weight: 700;
  text-transform: uppercase;
  color: white;
  background: red;
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
  box-shadow: 0px 2px 0px #666;
  border-radius: 5px;
  border: none;
  width: 80%;
}
.my-display {
  display: inline;
}
.my-no-display {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div class="container">
  <div class="row">
    <div class="col-xs-12 top-line">
      <h2>Who will win the Game of Thrones?</h2>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-12 my-choices">
      <p>Ram, Jon, Shyam, Shannon, Tate, Quy, Mary, or Sanjay?</p>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-8 my-input">
      <input type="text" onfocus="if(this.value == 'Take your best guess!') { this.value = ''; }" placeholder="Take your best guess!" />
    </div>
    <div class="col-xs-4 my-button">
      <button class="submit-button">
        Submit
      </button>
    </div>
  </div>
  <div class="row">
    <div class="col-xs-12 my-answer">
      <span class="mary pick my-no-display">We all love the walk of shame.</span>
      <span class="jon pick my-no-display">Isn't he too busy with tindr?</span>
      <span class="shyam pick my-no-display">We always knew his fingers were little.</span>
      <span class="shannon pick my-no-display">Because that's where a Khaleesi belongs.</span>
      <span class="tate pick my-no-display">Ramsey? Ewww.</span>
      <span class="quy pick my-no-display">What she said.</span>
      <span class="ram pick my-no-display">So into it!</span>
      <span class="sanjay pick my-no-display">Another Lannister?</span>
      <span class="none pick my-no-display">This is a terrible idea.</span>
    </div>
  </div>
</div>

＆＃13;

<asp:RangeValidator ID="rngPaymentAmount" runat="server" 
    ControlToValidate="txtPaymentAmount" MaximumValue="1000.00" MinimumValue="5.00" 
    Type="Double" CssClass="floatLeft" SetFocusOnError="True"  Display="Dynamic" meta:resourcekey="revPaymentAmountACHResource1" />

＆＃13;

＆＃13;

＆＃13;

Answer 3

我真的不明白你用这条线尝试了什么：

if (myPick == "ram","mary","jon","shyam","shannon","tate","quy","sanjay")

我认为它应该是：

if (myPick === "ram" || myPick === "mary" || myPick === "jon" || myPick === "shyam" || myPick === "shannon" || myPick === "tate" || myPick === "quy" || myPick === "sanjay")