自舉模式對話框不顯示出來，而在JQuery的

Question

檢查條件這是我的jQuery代碼

$(document).ready(function() 
{ 
    $("#pincode-check").click(function() 
     { 
      var pincode = $("#pincode").val(); 

      if(pincode == "" || pincode == null) 
       { 
        var data = "<div class='modal-dialog'>"+ 
            "<div class='modal-content'>"+ 
             "<div class='modal-header' align='center'>"+ 
              "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>"+ 
             "</div>"+ 
             "<div class='modal-body'>"+ 
              "Please Enter A Valid Pincode. The pincode you have entered is <b>Blank</b> or <b>Invalid</b>"+ 
             "</div>"+ 
             "<div class='modal-footer'>"+ 
              "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>"+ 
             "</div>"+ 
            "</div>"+ 
           "</div>"; 
           $('#pincode-modal').html(data); 
           $('#pincode-modal').modal('show'); 
       } 

      if(pincode == "400607" || pincode == "444605") 
       { 
        var data = "<div class='modal-dialog'>"+ 
            "<div class='modal-content'>"+ 
             "<div class='modal-header' align='center'>"+ 
              "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>"+ 
             "</div>"+ 
             "<div class='modal-body'>"+ 
             "</div>"+ 
             "<div class='modal-footer'>"+ 
              "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>"+ 
             "</div>"+ 
            "</div>"+ 
           "</div>"; 
           $('#pincode-modal').html(data); 
           $('#pincode-modal').modal('show'); 
       } 

      else 
       { 
        var data = "<div class='modal-dialog'>"+ 
          "<div class='modal-content'>"+ 
           "<div class='modal-header' align='center'>"+ 
            "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>"+ 
           "</div>"+ 
           "<div class='modal-body'>"+ 
            "We do not currently supply broadband connection in your area. You can visit our contact page & leave us a feedback."+ 
            "<br /><br /><a href='http://www.uncbroadband.com/contact' title='unc'>Click here to visit Contact Us Page!</a>"+ 
           "</div>"+ 
           "<div class='modal-footer'>"+ 
            "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>"+ 
           "</div>"+ 
          "</div>"+ 
         "</div>"; 
         $('#pincode-modal').html(data); 
         $('#pincode-modal').modal('show'); 
       } 
     }); 
}); 

這也是我增加了我的HTML代碼

<div class="display-tc animate-box" data-animate-effect="fadeIn"> 
    <h1 class="main-title">We connect you to the internet world. Quick setup & dazzling speed than any other providers</h1> 
    <h2>Enter Your Pincode Below To Check Connection Delivery Status!</h2> 
    <div class="row"> 
     <form class="form-inline" id="fh5co-header-subscribe"> 
      <div class="col-md-6 col-md-offset-3"> 
       <div class="form-group"> 
        <input type="text" class="form-control" id="pincode" placeholder="Enter Your Pincode Here!"> 
        <button type="submit" id="pincode-check" class="btn btn-default">Check Status!</button> 
       </div> 
      </div> 
     </form> 
    </div> 
</div> 

腳本代碼scripts.php停止提交表單的代碼：

<script> 
    $(document).on("submit", false); 
</script> 

問題是每當我通過JQuery檢查條件爲無論我放入輸入，但只有else塊正在執行，每次執行else塊時都會默認pin碼。

我已經提醒了該值，該值正在警告框中顯示，但我不明白爲什麼JQuery不理解它。

請幫忙。在此先感謝

Answer 1

在您的第一個if之後使用else if以防止打開兩個模態。

$(document).ready(function() { 
 
    $("#pincode-check").click(function() { 
 
    var pincode = $("#pincode").val(); 
 

 
    if (pincode == "" || pincode == null) { 
 
     var data = 
 
     "<div class='modal-dialog'>" + 
 
      "<div class='modal-content'>" + 
 
      "<div class='modal-header' align='center'>" + 
 
       "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>" + 
 
      "</div>" + 
 
      "<div class='modal-body'>" + 
 
       "Please Enter A Valid Pincode. The pincode you have entered is <b>Blank</b> or <b>Invalid</b>" + 
 
      "</div>" + 
 
      "<div class='modal-footer'>" + 
 
       "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>" + 
 
      "</div>" + 
 
      "</div>" + 
 
     "</div>"; 
 
     $('#pincode-modal').html(data); 
 
     $('#pincode-modal').modal('show'); 
 
    }else if (pincode == "400607" || pincode == "444605") { 
 
     var data = 
 
     "<div class='modal-dialog'>" + 
 
      "<div class='modal-content'>" + 
 
      "<div class='modal-header' align='center'>" + 
 
       "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>" + 
 
      "</div>" + 
 
      "<div class='modal-body'>" + 
 
      "</div>" + 
 
      "<div class='modal-footer'>" + 
 
       "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>" + 
 
      "</div>" + 
 
      "</div>" + 
 
     "</div>"; 
 
     $('#pincode-modal').html(data); 
 
     $('#pincode-modal').modal('show'); 
 
    } else { 
 
     var data = 
 
     "<div class='modal-dialog'>" + 
 
      "<div class='modal-content'>" + 
 
      "<div class='modal-header' align='center'>" + 
 
       "<h3 class='modal-title'>UNCBroadband - Pincode Status</h3>" + 
 
      "</div>" + 
 
      "<div class='modal-body'>" + 
 
       "We do not currently supply broadband connection in your area. You can visit our contact page & leave us a feedback." + 
 
       "<br /><br /><a href='http://www.uncbroadband.com/contact' title='unc'>Click here to visit Contact Us Page!</a>" + 
 
      "</div>" + 
 
      "<div class='modal-footer'>" + 
 
       "<button class='btn btn-primary' type='button' data-dismiss='modal'>Close!</button>" + 
 
      "</div>" + 
 
      "</div>" + 
 
     "</div>"; 
 
     $('#pincode-modal').html(data); 
 
     $('#pincode-modal').modal('show'); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="display-tc animate-box" data-animate-effect="fadeIn"> 
 
    <h1 class="main-title">We connect you to the internet world. Quick setup & dazzling speed than any other providers</h1> 
 
    <h2>Enter Your Pincode Below To Check Connection Delivery Status!</h2> 
 
    <div class="row"> 
 
    <form class="form-inline" id="fh5co-header-subscribe"> 
 
     <div class="col-md-6 col-md-offset-3"> 
 
     <div class="form-group"> 
 
      <input type="text" class="form-control" id="pincode" placeholder="Enter Your Pincode Here!"> 
 
      <button type="submit" id="pincode-check" class="btn btn-default">Check Status!</button> 
 
     </div> 
 
     </div> 
 
    </form> 
 
    </div> 
 
    <div id="pincode-modal" class="modal fade" tabindex="-1" role="dialog"></div> 
 
</div>