javascript - 使用dojo触发鼠标悬停事件?

标签 javascript dojo

在 jquery 中,您可以使用 $(element).mouseover() 触发 mouseover 事件。

在dojo中使用connect函数后,我不太确定如何触发事件。当我使用 connect 和 click 时,我可以使用 element.click() 来触发单击,但对于其他事件(如 mouseover),调用 element.mouseover() 不起作用。那么如何使用 Dojo 触发鼠标悬停等事件呢? (我知道有简单的 js 方法可以做到这一点,例如 fireEvent,但它很困惑并且不能跨浏览器证明)

这是一些代码

var myButton = dojo.byId("myButton"),
    myDiv = dojo.byId("myDiv");

dojo.connect(myButton, "mouseover", function(evt){
    dojo.style(myDiv, "backgroundColor", "blue");
});

dojo.connect(myButton, "click", function(evt){
    dojo.style(myDiv, "backgroundColor", "yellow");
});

myButton.click();//works

myButton.mouseover();//doesn't work​

jsFiddle 上的代码:http://jsfiddle.net/mHKDt/28/

最佳答案

对于 dojo 1.7 示例来说应该可以做到这一点。您不需要 body 标记上的样式表或 claro 类。它们是我的草稿本模板的一部分,我使用了尝试的东西。

<html>
    <head>
            <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dijit/themes/claro/claro.css" media="screen">
            <!-- load dojo and provide config via data attribute -->
            <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js"
                    data-dojo-config="async: true"></script>
    </head>
    <script type="text/javascript">
    <!--
    require(["dojo/mouse",
             "dojo/dom",
             "dojo/on",
             "dojo/domReady!"],function(mouse,dom,on){
                    var node = dom.byId("myImg")
                    on(node,mouse.enter,function(){
                        console.info("In " + node.title);
                    });

                    on(node,mouse.leave,function(){
                        console.info("Out " + node.title);
                    });
    });         
    //-->
    </script>

    <body class="claro">
        <img id="myImg" title="yay google" src="http://www.google.com/ig/images/jfk/google_color.png"/>
    </body>
</html>

关于javascript - 使用dojo触发鼠标悬停事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10222296/

相关文章:

javascript - 禁用点击模式打开?

javascript - 如何在 Javascript 中迭代嵌套对象数组

javascript - 修复了在手机上向下滚动时显示的 div

javascript - 如何覆盖 FilteringSelect dojo 小部件的 onchange 事件的默认行为?

jquery - Dojo 附加按钮(如 jQuery)

javascript - Dojo:TabContainer - 如何在标题中放置菜单按钮?

javascript - 使用 jQuery 将字符串添加到文本区域

javascript - Vue组件中继承CSS

jquery - 是否有一个 jQuery 小部件与 DOJO 的 TitlePane 相同?

java - 如何在 Spring Roo/Dojo 中做一个非强制性的下拉框?