Question

我想在不单击选择标签的情况下获得选择选项。

jQuery

    var sub = $('#xyz').option[value = 14]
    $('#test').text(sub)

我尝试过的其他jQuery代码

 var sub = $('select[name="abc"] option[value= '14']');
 $('#test').text(sub)

HTML

<select name="abc" id="xyz">

<option value="12">Apple</option>

<option value="13">Banana</option>

<option value="14">PineApple</option>
</select>
<p id="test">This is some <b>bold</b> text in a paragraph.</p>

Answer 1

使用$("#xyz option[value='14']").text()获取指定其值的选项的文本

这是示例

console.log($("#xyz option[value='14']").text())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select name="abc" id="xyz">

<option value="12">Apple</option>

<option value="13">Banana</option>

<option value="14">PineApple</option>
</select>

Answer 2

不确定要执行的操作，但是一旦将“ 14”替换为“ 14”，您尝试的第二个代码实际上是正确的，因为您的字符串以}开始：

Answer 3

您不需要jQuery，在普通的Java语言中非常简单。

xyz.querySelector(`option[value="14"]`).textContent

通过value属性的14属性为您提供选项的文本值。

input.addEventListener('input', (e) => {
  test.textContent = `${e.target.value} is ` +  xyz.querySelector(`option[value="${e.target.value}"]`).textContent;  
})

<select name="abc" id="xyz">
  <option value="12">Apple</option>
  <option value="13">Banana</option>
  <option value="14">PineApple</option>
</select>
<input type="number" min="12" max="14" step="1" value="12" id="input" />

<p>The current value is: <span id="test"></span></p>

Answer 4

我对jQuery感到生疏，但是要在Vanilla JS中做到这一点

获取可更新的内容框和选项列表
从结果选项列表中创建可映射的数组
过滤至所需选项
更新您的内容框

const textBox = document.getElementById('test');
const options = document.querySelectorAll('#xyz option');

let option = Array.from(options, option => ({ value: Number(option.value), text: option.textContent}))
  .filter(entry => entry.value === 12)
  .pop();

textBox.textContent = `${option.value}: ${option.text}`;

<select name="abc" id="xyz">

<option value="12">Apple</option>

<option value="13">Banana</option>

<option value="14">PineApple</option>
</select>
<p id="test">This is some <b>bold</b> text in a paragraph.</p>

无需选择选择ID。获得价值

4 个答案: