如何定義值，如何顯示隱藏輸入字段的值？

Question

$(document).ready(function() { 
 
    $(".city_name").click(function() { 
 
    city = this.id; 
 
    course = $("#courses").val(); 
 
    course_type = $("#courses_type").val(); 
 
    course_type2 = $("#courses_type2").val(); 
 
    course_type3 = $("#courses_type3").val(); 
 
    alert(course); 
 
    alert(courses_type); 
 
    alert(courses_type2); 
 
    alert(courses_type3); 
 
    alert(city); 
 
    $.ajax({ 
 
     type: "POST", 
 
     data: { 
 
     "id": city, 
 
     "courses": course, 
 
     "courses_type": course_type, 
 
     "courses_type2": course_type2, 
 
     "courses_type3": course_type3 
 
     }, 
 
     url: "filter-city-colleges.php", 
 
     success: function(data) { 
 
     alert(data); 
 
     } 
 

 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="city_name"> Click me 
 
    <div> 
 
    <input type="hidden" id="courses_type" value="field"> 
 
    <input type="hidden" id="courses_type2" value="univer"> 
 
    <input type="hidden" id="courses_type3" value="course">

在這段代碼中，當我警惕courses_type，courses_type2，courses_type3 jQuery中，它表現出[objectHTMLcollection。如何檢索隱藏的輸入框的值。

Answer 1

當var關鍵字是不是一個變量之前使用，它將在全局空間中定義

$(document).ready(function(){ 
    $(".city_name").click(function(){ 
    var city=this.id; 
    course = $("#courses").val(); // cannot find any DOM with id courses 
    var course_type = $("#courses_type").val(); 
    alert(course); // It will alert undefined since there is no DOM with id course 

    alert(courses_type); // will alert field 
    var course_type2 = $("#courses_type2").val(); 
    var course_type3 = $("#courses_type3").val(); 
    // put the alert here after retriving the value from DOM, before retrieving it will be undefined 
    alert(courses_type2); 
    alert(courses_type3); 
    alert(city); 
    $.ajax({ 
     // rest of the ajax 
     }); 
    }); 
}); 

Answer 2

嘗試使用以下代碼來傳遞所有hiddedn字段與值AJAX請求：

$(document).ready(function(){ 
     $(".city_name").click(function(){ 
      city=this.id; 
      course = $("#courses").val(); 

      var data = {}; 
      $('input[type="hidden"]').each(function(){ 
       if($(this).val()){ 
        data[$(this).attr('id')] = $(this).val(); 
       } 
      }); 
      data['id'] = city; 
      data['course'] = 'course'; 

      $.ajax({ 
       type:"POST", 
       data:data, 
       url:"filter-city-colleges.php", 
       success:function(data){ 
        alert(data); 
       } 

      }); 
     }); 
    }); 

Answer 3

您需要在alert()函數中提及正確的變量名稱，例如，您有一個名稱爲course_type的變量，但您在警報中提到了course**s**_type。只是改變它:)

$(document).ready(function() { 
 
    $(".city_name").click(function() { 
 
    city = this.id; 
 
    course = $("#courses").val(); 
 
    course_type = $("#courses_type").val(); 
 
    course_type2 = $("#courses_type2").val(); 
 
    course_type3 = $("#courses_type3").val(); 
 
    // alert(course); 
 
    alert(course_type); 
 
    alert(course_type2); 
 
    alert(course_type3); 
 
    alert(city); 
 
    $.ajax({ 
 
     type: "POST", 
 
     data: { 
 
     "id": city, 
 
     "courses": course, 
 
     "courses_type": course_type, 
 
     "courses_type2": course_type2, 
 
     "courses_type3": course_type3 
 
     }, 
 
     url: "filter-city-colleges.php", 
 
     success: function(data) { 
 
     alert(data); 
 
     } 
 

 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="city_name" id="cityId"> Click me 
 
    <div> 
 
    <input type="hidden" id="courses_type" value="field" /> 
 
    <input type="hidden" id="courses_type2" value="univer" /> 
 
    <input type="hidden" id="courses_type3" value="course" />