如果定义了值，如何显示隐藏输入字段的值？

Question

＆＃13;

＆＃13;

$(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);
      }

    });
  });
});

＆＃13;

<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">

＆＃13;

＆＃13;

＆＃13;

在此代码中，当我在jquery中提示courses_type，courses_type2，courses_type3时，它显示[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" />