为何运行次序不按照程序运行?

<style>.entered{font-size:36px;width:200px;height:100px;}#test{border:2px solid red;background:#fdd;width:60px;height:60px;}</style></head><body>
    <div id="test">移进来</div>    
    <script>
        $("#test").bind("mouseenter mouseout",function(event){
            $(this).toggleClass("entered");
            alert("鼠标指针位于(" + event.pageX + "," + event.pageY + ")");
        });    
    </script>

上面这个简单的jquery,
issu1
.entered{font-size:36px;width:200px;height:100px;}
font-size:36px;起作用了 ,为何width:200px;height:100px; 没有起作用?
issue2
$(this).toggleClass("entered");为何在
alert("鼠标指针位于(" + event.pageX + "," + event.pageY + ")");的后面运行?
如何让 $(this).toggleClass("entered"); 运行完成后,执行alert?


泛舟湖上清波郎朗
浏览 591回答 1
1回答

交互式爱情

issue1: css权重问题;id选择器优先于class选择器;issue2: toggleClass已经执行,只是alert中断了样式的重绘;你可以在toggleClass中使用function,在function中打印日志,然后会发现日志打印成功,然后alert,然后alert关闭后,样式变更才生效
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript