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

时间:2016-11-09 11:20:53

标签: javascript jquery html

我需要获取所选select标签的标签文本,以便我可以使用该标签文本并设置在另一个输入标签中,但获取(空字符串) ...以下是我的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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

使用siblings()方法并使用CollegeId代替this,其中this不是指元素。

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

&#13;
&#13;
function getClassesAndYear(CollegeId, cnt) {
  var text = $(CollegeId).siblings('label').text();
  console.log(text);
}
&#13;
<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>
&#13;
&#13;
&#13;