javascript - 在不使用 onchange 属性的情况下获取选定的值

Question

我想要相同的结果而不使用该onchange属性。一些想法？

这是HTML：

<select onchange="filtro(this)" id="tipo" name="noticia/conteudo/tipo">
    <option  value="Layout1">Layout1</option>
    <option value="Layout2">Layout2</option>
    <option value="Layout3">Layout3</option>
    <option value="Layout4">Layout4</option>
    <option value="Layout5">Layout5</option> 
</select>

这是JS：

function filtro(a) {
    var x = (a.value || a.options[a.selectedIndex].value);
    alert(x);
    if (x == "Layout4"){
        alert('test4');
    } 
}

Answer 1

您可以添加一个事件侦听器以避免具有 onchange 属性。

HTML：

<select id="tipo" name="noticia/conteudo/tipo">
    <option value="Layout1">Layout1</option>
    <option value="Layout2">Layout2</option>
    <option value="Layout3">Layout3</option>
    <option value="Layout4">Layout4</option>
    <option value="Layout5">Layout5</option> 
</select>

JavaScript：

function filtro(a) {
    var x = (a.value || a.options[a.selectedIndex].value);
    alert(x);
    if (x == "Layout4"){
        alert('test4');
    } 
}

var sel = document.getElementById('tipo');
sel.addEventListener('change', function() { filtro(sel) }, false);

JSFiddle：http: //jsfiddle.net/jeffshaver/HfmWV/7/

Answer 2

你可以轻松地做到这一点

var e = document.getElementById("tipo");
var tipoValue = e.options[e.selectedIndex].value;

将使tipoValue 成为所选选项的值。如果您想获取文本，可以使用以下方法：

var e = document.getElementById("tipo");
var tipoText = e.options[e.selectedIndex].text;

一般来说，我的建议是考虑引入一些 javascript 库，例如jQuery

Answer 3

您只能在没有属性的 js 中执行此操作

document.getElementById("id").onchange=function(){ ... };