A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

本帖最后由 黑马杨凯 于 2012-6-28 19:49 编辑

代码如下,做练习时遇到一个问题,给select的option动态添加mouseover事件,结果不响应,请大家指教,先行谢过~怀疑它是不是没有mouseover事件,求真相,不解~
<head>
    <title>选队伍</title>
    <style type="text/css">
        .button1
        {
            width:100%;
            float:left;
        }
    </style>
    <script src="js/jquery-1.4.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#select1 option").mouseover(function () {
                $(this).css("backgroundColor", "red");
            });

        });

    </script>
</head>
<body>

   <select id="select1"  style="float:left;width:100px" multiple="multiple" size="10">
        <option>北京队</option>
        <option>上海队</option>
        <option>山东队</option>
        <option>辽宁队</option>
        <option>吉林队</option>
        <option>河北队</option>
        <option>内蒙古队</option>
   </select>
  </body>
</html>

评分

参与人数 1技术分 +1 收起 理由
宋天琪 + 1

查看全部评分

5 个回复

正序浏览
本帖最后由 黑马杨凯 于 2012-6-29 10:32 编辑

通过百度等得到一些参考资料,基本上都建议用div来模拟select来做,已验证在IE浏览器上option不支持mouseover,在其他非IE内核的浏览器上正常显示,刚开始学习jquery,太相信它的跨浏览器特性了,没在其他浏览器上测试过~失误失误~我现在的水平还无法用div来模拟select,如果有相关解决方案,希望能指教~拜谢~
回复 使用道具 举报
许庭洲 发表于 2012-6-29 09:34
在option标签中加上一个title属性试试看!

试了啊 只有title中的值得显示 option的背景色没有发生变化
回复 使用道具 举报
黑马杨凯 发表于 2012-6-29 09:31
为什么加了mouseover事件没有响应呢,想达到鼠标悬停在option上面就高亮显示的效果,但是试了很多办法都不 ...

在option标签中加上一个title属性试试看!
回复 使用道具 举报
为什么加了mouseover事件没有响应呢,想达到鼠标悬停在option上面就高亮显示的效果,但是试了很多办法都不行啊~
回复 使用道具 举报
1,在select的option标签中加上一个title属性,这个属性叫title属性,即title="值";
2,   <select id="select1"  style="float:left;width:100px" multiple="multiple" size="10">
        <option title="1">北京队</option>
        <option title="2">上海队</option>
        <option title="3">山东队</option>
        <option title="4">辽宁队</option>
        <option title="5">吉林队</option>
        <option title="6">河北队</option>
        <option title="7">内蒙古队</option>
   </select>

评分

参与人数 1技术分 +1 收起 理由
宋天琪 + 1

查看全部评分

回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马