jquery - 如何在 jquery 中控制台选定的和默认的下拉值?

标签 jquery html-select console.log

我想控制台我选择的下拉值加载,因为我正在使用下面的代码它的工作。但如果我从下拉列表中更改我的选择,那么我也想在控制台中查看我当前选择的值。通过这个我可以为我的下一个 if else 操作获取当前选择的值。

var s = document.getElementsByName('org_id')[0];
var value = s.options[s.selectedIndex].value;

console.log(value);

通过上面的代码我可以获得 onload 选定的值。但之后,如果我从下拉列表中更改选择,我的控制台不会显示当前选择的值。如何用 jquery 实现这一点。

<select name="org_id" id="org_id" class="required">
    <option value="">--Select Organization--</option>
    <option value="1">ABC</option>
    <option value="2">DEF</option>
    <option value="3">GHI</option>
    <option value="4">JKL</option>
    <option value="5">MNO</option>
</select>

最佳答案

您需要执行以下步骤:

  1. 添加change <select> 的事件监听器将在 option 更改时触发的下拉菜单
  2. 然后,您需要在页面加载时显式调用此监听器函数,以便可以打印最初选择的值。

var s = document.getElementsByName('org_id')[0];

s.addEventListener("change", changeOrg);

function changeOrg(){
  var value = s.options[s.selectedIndex].value;
  console.log(value);
}

//on page load
changeOrg();
<select name='org_id'>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

关于jquery - 如何在 jquery 中控制台选定的和默认的下拉值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49112488/

相关文章:

javascript - 从命令行执行 HTML Javascript

jquery - 防止默认值在我的 javascript 中不起作用

javascript - 获取 bootstrap-select 中的当前值

javascript - bootstrap多选下拉菜单不下拉

javascript - 为什么在 Edge 中记录一个空字符串变量会返回一个对象

jquery - 悬停一个 DIV,给封闭的 DIV 一个阴影

javascript - 响应式菜单未显示 Uncaught TypeError : jQuery(. ..).on 不是 WordPress 网站中的功能

javascript - 使用 Greasemonkey 更改变量或激活 JS 链接的 <select> 下拉列表

javascript - 恢复 console.log()

javascript - console.log 内具有控制台日志输出的函数打印 undefined