使用jQuery防止提交如果字段爲空，它返回值爲零即使輸入包含數據

Question

當我使用jQuery檢查船舶城市不是空它的工作完成，如果它是空的，並阻止提交，但它也阻止提交時，我填寫因爲它總是讀取值= 0，即使它包含數據。

<div class="form-group col-md-6"> 
         <div class="shipcountry"> 
         <b> Select Country </b><?php 
         echo "<select required name='shipcountry' id='shipcountry' onchange='showCityship(this);'>"; 


         if(isset($row['ship_country'])) { 
          echo " <option value='{$row["ship_country"]}' >"; 


          echo $row["ship_country"]; 

          "</option>"; 
         } else { 
          echo "<option value=''>Select</option>";} 
         $query = 'SELECT * FROM `country_dhl` '; 
         $res_qu = mysql_query($query); 

         while ($country = mysql_fetch_array($res_qu)) { 


          echo " <option value='{$country["country"]}'>"; 
          echo $country["country"]; 


          echo "</option>"; 
         } 
         echo "</select>"; 
         ?> 
        </div> 

    <div class="form-group col-md-6" style="display: none;" id="othershipcountry"> 
<b> City </b> 
<input type="text" name="shipcity" class="form-control" 
     placeholder="Enter Your City"/> 
    </div> 

<div class="form-group col-md-6" style="display: none;" id="city_ship"> 
<input type="text" name="shipcity" class="form-control" 
     placeholder="Enter Your City"/> 
    </div> 

jQuery來顯示和隱藏DIV

$(document).ready(function() { 
    $('#othershipcountry').show(); 
    $('#city_ship').hide(); 
    $('#othershipcity').hide(); 

    $('.shipcountry').click(function() { 
     var selected = $(this).val(); 
     if(selected == 'Roma') { 
      $('#othershipcountry').hide(); 
      $('#city_ship').show(); 
      $('#othershipcity').hide(); 
     } else { 
      $('#othershipcountry').show(); 
      $('#city_ship').hide(); 

      $('#othershipcity').hide(); 
     } 
    }); 
}); 



jquery when submit 

$(document).ready(function() { 


    $('#submit').click(function(e) { 

     if ($('#city_ship').css('display') != 'none') { 

      var ship = $('#city_ship').val(); 
      if (ship.length === 0) { 
       console.log("city"); 
       alert("You must choose your Ship city "); 
       e.preventDefault(); 
      } 
     } 
     if ($('#othershipcountry').css('display') == 'block') { 
      var ship = $('#othershipcity').val(); 
      if (ship.length === 0) { 
       console.log("othercity"); 
       alert("You must fill Ship city"); 

       e.preventDefault(); 
      } 
      else{ 
       console.log("other"); 
      } 
     } 

    }); 
}); 

Answer 1

您可以申請更改事件到你的輸入欄，每次檢查輸入的長度，它會改變，如果它的長度等於0，所以世界上沒有輸入，禁用提交按鈕，否則你打開它：

$("#city_ship").bind("change paste keyup", function() { 
{ 
    if (this.value.length == 0) 
     $('#submit').attr("disabled", true); 
    else 
     $('#submit').attr("disabled", false); 
}); 

Answer 2

我能解決的問題，因爲在div長度總是返回零，即使它包含數據，因爲jQuery中我試圖讓d的長度iv不是輸入的長度。

解決方案：

 <input type="text" name="shipcity" class="form-control" 
     placeholder="Enter Your City"/> 

選擇有：

$('[ name = "shipcity"]') 

city_ship僅僅是一個div。