javascript - 无法获取所选选择标签的标签文本

Question

我需要获取所选选择标签的标签文本，以便我可以使用该标签文本并在另一个输入标签中设置，但得到 (空字符串) ...以下是我的 HTML代码和jquery代码

function getClassesAndYear(CollegeId, cnt) {
  var text = $(this).closest('label').text();
  console.log("text");
  console.log(text);
}


//Following is the code used on university select
	function getColleges(UniId, cnt){
	  var text = $(UniId).siblings('label').text();
			console.log("text");
			console.log(text);
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
This is HTML code-
<div class="col-md-2">
  <label class="control-label">University</label>
  <select name="universityId" class="form-control" onchange="getColleges(this.value, 1)" id="universityNameId1">
    <option value="">Select University</option>
    {% for university in universityName %}
    <option value="{{university.id}}">{{university.university_name}}</option>
    {% endfor %}
  </select>
</div>

<div class="col-md-2">
  <label class="control-label">College Name</label>
  <select name="collegeName" id="collegeNameId1" onchange="getClassesAndYear(this, 1)" class="form-control" multiple="multiple">
    <option value="">Select College</option>
  </select>
</div>

<div class="col-md-2">
  <label class="control-label">Enrollment Year</label>
  <select name="enrollmentYear" id="yearNameId1" onchange="getClassesAndYear(this, 1)" class="form-control" multiple="multiple">
    <option value="">Select Year</option>
  </select>
</div>

<div class="col-md-2">
  <label class="control-label col-md-3">Class</label>
  <select id="classNameId1" class="form-control select2 classNameId" name="className" multiple>
    <option value="">Select Class</option>
  </select>
</div>

Answer 1

使用siblings()方法并使用 CollegeId 而不是 this，其中 this 不引用该元素。

function getClassesAndYear(CollegeId, cnt){     
    var text = $(CollegeId).siblings('label').text();
    console.log("text");
    console.log(text);
}

function getClassesAndYear(CollegeId, cnt) {
  var text = $(CollegeId).siblings('label').text();
  console.log(text);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
This is HTML code-


<div class="col-md-2">
  <label class="control-label">College Name</label>
  <select name="collegeName" id="collegeNameId1" onchange="getClassesAndYear(this, 1)" class="form-control" multiple="multiple">
    <option value="">Select College</option>
    <option value="">Select College</option>
    <option value="">Select College</option>
  </select>
</div>

<div class="col-md-2">
  <label class="control-label">Enrollment Year</label>
  <select name="enrollmentYear" id="yearNameId1" onchange="getClassesAndYear(this, 1)" class="form-control" multiple="multiple">
    <option value="">Select Year</option>
    <option value="">Select Year</option>
    <option value="">Select Year</option>
    <option value="">Select Year</option>
  </select>
</div>

<div class="col-md-2">
  <label class="control-label col-md-3">Class</label>
  <select id="classNameId1" class="form-control select2 classNameId" name="className" multiple>
    <option value="">Select Class</option>
    <option value="">Select Class</option>
    <option value="">Select Class</option>
  </select>
</div>