jquery从所选下拉列表中获取第一个文本元素属性

时间:2017-03-30 14:01:03

标签: javascript jquery ajax

既简单又复杂的问题: 我从ajax请求以编程方式创建了我的下拉项目,这没关系。所以我以方便的aestetic方式提供名字和姓氏,但我需要发送一个只有姓氏的ajax帖子,其他目的需要值。

$('#dropDocente').append('<option value="'+value.idDocente+'"">' + value.surname   + ' ' + value.name  +'</option>');

我将实现的目标是:

var testd = $("#dropDocente option:selected").text();
console.log("Surname is : "+testd);
desired output == Surname is : Doe

所以,另一方面,我想在选定的保管箱中只获得第一个文本元素。

我可以帮助我了解如何实现目标吗?

3 个答案:

答案 0 :(得分:2)

在jQuery中,您不使用.text()方法来获取下拉菜单的值。你需要:

var testd = $("#dropDocente").val();

,这将从下拉列表中返回所选选项的值。

答案 1 :(得分:1)

您可以将value.surname作为data-surname数据标记添加到该选项中,然后通过选择该选项并使用.data('surname')来检索该值。你可以为你想要挑出的任何其他价值做到这一点

$(document).ready(function() {
  var values = [
    { surname: "Doe", name: "John", idDocente: "some value here" },
    { surname: "Shmo", name: "John", idDocente: "some value here2" },
    { surname: "Little", name: "John", idDocente: "some value here3" },
  ];
  
  for (var i = 0; i < values.length; i++) {
  var value = values[i];
    $('#dropDocente').append('<option value="'+value.idDocente+
   '" data-surname="'+ value.surname +'">' + value.surname   + ' ' 
   + value.name  +'</option>');
  }
  
  // default first
  $('.results').text($("#dropDocente option:first").data('surname') + ', ' + $("#dropDocente option:first").val());
  
  // on change, get the surname
  $('#dropDocente').on('change', function() {
    $('.results').text($("#dropDocente option:selected").data('surname')+ ', ' + $("#dropDocente option:selected").val());
  });
  
  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dropDocente">
</select>
<br/><br/><br/>
<div class="results">
</div>

答案 2 :(得分:1)

您可以在选择更改时拆分全名。

这样的事情:

$('select').on('change', function(){
    var id = $(this).val();
    var fullName = $('select option:selected').text();
    var surname = fullName.split(" ", 1);
});

此处的完整示例:https://jsfiddle.net/1aj06Lw6/1/