js怎样监听Select的Onchage事件?

zc_0101 2009-01-13 04:50:47

有一个select 例如:

<select id="selectid" onchange="_f()">

     <option value="a">a</a>

     <option value="b">b</a>

</select>

但我现在不想用在select里面加"onchange"的方式来执行函数_f(),
我想用一个单独的函数来监听这个select，一旦被onchange了，就
自动执行函数_f()

最好兼容IE和FF，谢谢帮忙！

...全文

4948 13 打赏收藏转发到动态举报

写回复

用AI写文章

13 条回复

切换为时间正序

请发表友善的回复…

发表回复

ag503685496 2010-04-18

打赏
举报

3楼的内容，我注册了，也登陆了，还是看不到
不知怎么回事？

yuqinghehappy 2009-01-16

打赏
举报

通过var select=document.getElementById("selectid")找到select
然后可以挂函数了select.onchange=function(){ }

liuhua19841201 2009-01-16

打赏
举报

<select id="selectid" >
<option value="a">a</a>
<option value="b">b</a>
</select>
<script>
document.getElementById("selectid").onchange=_f;
function _f()
{
alert("aaa");
}
</script>

用jquery就可以了
$(doument).ready拿到控件
自己去学一下
保证好用

hrdesign 2009-01-16

打赏
举报

郁闷，发现自己最近写东西不多想,又少了'on',element.attachEvent('onchange',_f)//针对IE

hrdesign 2009-01-16

打赏
举报

呵呵，我也写错了
element.attachEvent('change',_f,false)//针对IE
改成element.attachEvent('change',_f)//针对IE

hrdesign 2009-01-16

打赏
举报

其实大家说的都差不多，而三楼的函数
getListenerElement(wichelement)和$(element)是取得element对象，针对的不是你的问题，对于这两个函数前面的内容讲的是如何给创建的事件监听函数(addEventListener或者attachEvent)所调用的函数传递参数，但是我看你的问题，_f()好像也不需要传递参数，所以感觉没啥用

var element = document.getElementById('#selectid')
element.addEventListener('change',_f,false)//针对FF等符合DOM的浏览器
element.attachEvent('change',_f,false)//针对IE

zc_0101 2009-01-16

打赏
举报

其实我这个select 是通过另一个页面调入的，方式为


所以除了3楼以外其他的方法都不好使，但是3楼也没看懂。。。。

艾思软件-app开发公司 2009-01-13

打赏
举报

有点意思

lu_huanling 2009-01-13

打赏
举报

令一种可以这样:



<select id="selectid" >

     <option value="a">a</a>

     <option value="b">b</a>

</select>

<script>

document.getElementById("selectid").onchange=_f;

function _f()

{

	alert("aaa");

}

</script>

fosjos 2009-01-13

打赏
举报

楼主的意思还是一样，只是写法变化

window.onload = function(){
document.getElementById("selectid").onchange=_f;
}

littlelam 2009-01-13

打赏
举报



During my development on SSIP i run into serveral problems with adding events dynamicly. After searching of an example implemetation i found this function 

addEventListener(eventName, eventHandlerFunctionName, false);

Of corse there is an other one for ie:). Now i had the wish to pass parameters to the passed function. The approach i found looked like this: 

addEventListener(eventName, function example(params){expression;}, false);

This meen we define the function directly in the addEventListenern an can then use local variables. But that was also not the solution i'm looking for. Ok then i taught i could directly write the function with the dynparameter on the tag with dom manipulation, something like this: 

    function addListener(element,type,expression){

        element = getListenerElement(element);

        if (navigator.appName.indexOf("Explorer") != -1){

            expression = new Function(expression);

        }



        element.setAttribute(type, expression);    

    }



    function getListenerElement(wichelement){

        if(wichelement == 'body'){

            element = document.getElementsByTagName("body")[0];

        }else{

            element = $(wichelement);

        }

        return element;

    }



    function $(element) {

      if (typeof element == 'string'){

        element = document.getElementById(element);

        return element;

      }

    }

Now you can pass a function as String that will work on Firefox. With IE you have to pass a function object so it will work. But you don't have to care about, because this small addListener function will handle that. 

The getListener Element just returns the handle element. It is not that smart, but fits my needs. 

The $ function i look up by prototype. Its just for reducing the length of the code. 

The only thing left is the remover function looking like this: 

    function removeListener(element,type){

        element = getListenerElement(element);

        element.setAttribute(type, '');    

    }

Thats the way it worked for me.

mostone 2009-01-13

打赏
举报

<html>
<head>
<script>
window.onload = function(){
document.getElementById("selectid").onchang = function(){
_f()
}
}

function -f(){
alert(2222222);
}
</script>
</head>
<body>
<select id="selectid">
<option value="a">a</option>
<option value="b">b</option>
</select>
</body>
</html>

xinyung 2009-01-13