从所选内容中的值获取文本

Get text from value in a selection

本文关键字：获取 取文本      更新时间：2023-09-26

我试图创建一个函数，我传递一个选择器和值，我想获得文本

function getTextBySelectorAndValue(selector, value) {
    return $(selector + " option[value='" + value + "']").text();
}

错误，我明白了语法错误，无法识别的表达式：[object object]option[value='1']

看起来像选择器并没有真正工作

我把这种方法称为

getTextBySelectorAndValue($("#lodgerAppointmentLocation"), $("#lodgerAppointmentLocation").val());

您正在将一个jQuery对象传递给一个需要字符串选择器的函数。

我建议将选择器字符串传递给现有函数。。。

function getTextBySelectorAndValue(selector, value) {
  return $(selector + " option[value='" + value + "']").text();
}
$('#lodgerAppointmentLocation').on('change', function() {
  $('div#output').text(getTextBySelectorAndValue("#lodgerAppointmentLocation", $("#lodgerAppointmentLocation").val()));
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lodgerAppointmentLocation">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
<div id="output"></div>

或者更改函数以处理jQuery对象：

function getTextBySelectorAndValue($selected, value) {
  return $selected.find("option[value='" + value + "']").text();
}
$('#lodgerAppointmentLocation').on('change', function() {
  $('div#output').text(getTextBySelectorAndValue($("#lodgerAppointmentLocation"), $("#lodgerAppointmentLocation").val()));
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lodgerAppointmentLocation">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
<div id="output"></div>

或者，您可以使用:selected选择器检索所选选项的文本：

function getTextBySelectorAndValue($selected, value) {
  return $selected.find("option[value='" + value + "']").text();
}
$('#lodgerAppointmentLocation').on('change', function() {
  $('div#output').text($(this).find('option:selected').text());
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lodgerAppointmentLocation">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
<div id="output"></div>

编辑

我喜欢AtheistP3ace处理jQuery对象或选择器字符串的挑战
我使用instanceof jQuery来识别每个检查对象是否是jQuery对象的jQuery对象：

function getTextBySelectorAndValue(selector, value) {
  return selector instanceof jQuery ?
           selector.find("option[value='" + value + "']").text() :
           $(selector+" option[value='" + value + "']").text() ;
}
$('div#output').text(
  getTextBySelectorAndValue("#lodgerAppointmentLocation1", 1) + " / " +
  getTextBySelectorAndValue($("#lodgerAppointmentLocation2"), 2)
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="lodgerAppointmentLocation1">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
<select id="lodgerAppointmentLocation2">
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
<div id="output"></div>

相关文章：