我正在尝试编写一个Vimperator插件,允许使用提示模式在下拉菜单上模拟鼠标.我有提示模式工作,可以正确选择附加鼠标悬停事件的元素.问题是我的模拟鼠标功能不起作用.这就是我目前拥有的:
function SimulateMouseOver(elem)
{
var evt = elem.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('mouseover',true,true,
elem.ownerDocument.defaultView,0,0,0,0,0,
false,false,false,false,0,null);
var canceled = !elem.dispatchEvent(evt);
if(canceled)
alert('Event Cancelled');
}
上面的代码适用于某些页面,但不适用于其他页面.例如,它不适用于AccuWeather.任何关于如何模拟鼠标的想法都适用于大多数页面？
我有信用卡号码表格.该号码分为四个部分,就像真实的信用卡一样.
我想在表单中添加JavaScript品味,当用户在字段中键入四个字母时,焦点会自动转到下一个标签.但不是在最后一个标签.通过这样做,用户不必键入"tab"键来移动焦点.
可以在标签中添加一些额外的类,ID或名称.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>MoveFocus</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
// some code goes here.
});
</script>
</head>
<body>
<form action="post.php" method="post" accept-charset="utf-8">
<input type="text" value="" id="first" size="4" maxlength="4"/> -
<input type="text" value="" id="second" size="4" maxlength="4"/> -
<input type="text" value="" id="third" size="4" maxlength="4"/> -
<input type="text" value="" id="fourth" size="4" maxlength="4"/>
<p><input type="submit" value="Send Credit Card"></p>
</form>
</body>
</html>
我的页面上有几个链接(在a中<div id="theme-selector">),允许您更改CSS样式表:
$('#theme-selector a').click(function(){
var path = $(this).attr('href');
$('head link').remove();
$('head').append('<link type="text/css" href="'+path+'" rel="stylesheet" />');
return false;
});
现在,在我更改了页面上的样式后,我希望使用以下代码(我在$('head').append调用后放置)获取新的背景颜色:
var bgcolor = $('body').css('background-color');
alert(bgcolor);
问题是,我认为浏览器下载新样式表需要一些时间,我有时会在警报消息中获得旧的背景颜色.是否有一些我可以绑定的事件只会在页面上加载所有样式表后提醒我？
目前,我所能想到的只是使用setTimeout(function(){}, 5000);不太好的,因为如果在页面上加载所有CSS需要更长/更短的时间.
如果我需要澄清任何内容,请告诉我,我可以提供更多代码.
我有以下问题:我正在尝试编写一个javascript游戏,并且该字符由箭头键控制.
问题是,当按下按键时,在第一次按键和重复按下之间存在短暂的延迟.
此外,当按下"右箭头键"并按住它,然后按下"向上箭头键"时,角色不会移动到右上角,而是停止向右移动并开始向上移动.
这是我正在使用的代码:
<body onLoad="Load()" onKeyDown="Pressed(event)">
function Pressed(e) {
cxc = e.keyCode;
if(cxc == 37)
Move(-1,0);
if(cxc == 38)
Move(0,-1);
if(cxc == 39)
Move(1,0);
if(cxc == 40)
Move(0,1);
}
有没有人有想法？
所以,就像问题指定的那样,有没有办法在jQuery中触发mousemove事件,它还将鼠标坐标发送到事件对象？
到目前为止,我的代码可以使用.trigger(事件)函数触发mousemove,但event.pageX和event.pageY是未定义的.
使用.load,我将以下内容加载到#step_2 div中:
<div id="step_2">
Select a subcategory:
<select id="subcategory_id" name="subcategory_id">
<option value="0">All subcategories</option>
<option value="68">Cool</option>
<option value="15">Cooler</option>
<option value="74">Excellent</option>
</select>
</div>
然后我试图检测用户选择的东西:
$("#subcategory_id").on("change", function(){
alert( 'Success!' );
});
但没有成功.有谁看到我做错了什么？非常感谢.
笔记:
这是FireBug看到的完整CSS路径:
html.js body div#container div#main form div#step_2 select#subcategory_id
这是完整的javascript文件,如果上下文很重要:
$(document).ready(function() {
$("#category_id").change(function() {
$("#spinner").show();
$("#step_2").load("process.php?selected=category", { value: $(this).val() }, function() {
// Do something to say the data has loaded sucessfully
$("#spinner").hide();
});
});
$("#subcategory_id").on("change", function(){
alert( 'Success!' );
});
});
我正在尝试动态加载外部.js文件(根据我从用户那里得到的输入).目前我的代码如下所示:
function createScript(src, id) {
if (document.getElementById(id) == null) {
var newScript = document.createElement('script');
newScript.setAttribute("type", "text/javascript");
newScript.setAttribute("src", src);
newScript.setAttribute("id", id);
document.getElementsByTagName("head")[0].appendChild(newScript);
}
}
这种工作.它确实加载了脚本,但如果我尝试调用在新脚本中定义的函数,它将无法工作.奇怪的是,如果我等待一秒钟(使用alert("test")或类似的东西)脚本确实有效.
我想这是因为浏览器会<script>立即添加标签,但是需要更长时间才能"读取".js文件中的脚本.我试过玩"typeof testfunction === 'function'"几个变种,但没有运气.
这样做有什么好办法吗？
event.pageY获取相对于整个文档高度的鼠标位置(document.documentElement.offsetHeight我假设).
但是如何获得相对于当前视口的鼠标位置document.documentElement.clientHeight呢？
例如,如果浏览器窗口大小为720像素高度,我向下滚动3页并将鼠标放在窗口中间,位置应为"360",而不是1800(720 x 3 - 720/2).
我刚刚学到了一个关于javascript执行的重要事实,如果出现错误的话.在我开始对此做出结论之前,我最好先验证一下我是否正确.
给定一个包含2个脚本的HTML页面:
<script src="script1.js" />
<script src="script2.js" />
SCRIPT1:
doSomething();
SCRIPT2:
doSomeOtherThing();
这有效地导致单个脚本作为一个单元处理:
doSomething();
doSomeOtherThing();
特别是,如果doSomething抛出错误,执行就会中断.'script2'永远不会被执行.
这是我的"第1课" - 人们可能会认为,因为它是一个单独包含的文件,所以它不受script1的影响.但它是. =>请参阅下面的"延迟更新"
现在,如果我们按如下方式更改script2(假设我们在上面的某处包含了jQuery):
$(document).ready({ doSomeOtherThing(); });
并将脚本放在script2之前:
<script src="script2.js" />
<script src="script1.js" />
执行的顺序实际上仍然是'doSome(()某些时候由'doSomeOtherThing()'执行的'doSomething()'.
但是它以两个"单位"执行:
doSomething 作为文档的java脚本的一部分提前执行doSomeOtherThing 在处理document.ready事件时执行.如果doSomeOtherThing抛出异常,它将不会破坏第二个处理"单元".
(我不使用该术语,thread因为我认为所有脚本通常由同一个线程执行,或者更确切地说,这可能取决于浏览器.)
所以,我的第2课:即使JavaScript错误可能会阻止任何后续脚本执行,它也不会停止事件循环.
结论1
$(document).ready() 在定义应该独立于任何其他脚本执行的JavaScript代码块方面做得很好.
或者,换句话说:如果你有一段JavaScript,并且想要确保即使其他脚本失败也能执行它,那么将它放在一个$(document).ready().
这对我来说是新的,因为如果脚本依赖于完全加载的文档,我只会使用该事件.
结论2
更进一步,将所有脚本包装在a中$(document).ready()以确保所有脚本都"排队"执行可能是一个很好的架构决策.另外,在上述第二示例中,如果script2.js被列入后 script1.js实施例1如下所示:
<script src="script1.js" />
<script src="script2.js" />
script1.js中的错误会阻止doSomeOtherThing()甚至被注册,因为该$(document).ready() …
我有一个onbeforeunload事件,应该在用户进入新页面时触发.它运行良好,但我发现只要用户从他们所在的页面下载文件,它也会在Chrome中被触发.
我希望能够判断事件是否被解雇,因为它是由文件下载触发的.最好的方法是什么？
编辑:作为澄清,我不拥有我正在听的网站onbeforeunload.该事件由第三方网站上安装的Javascript片段收听.
javascript ×9
jquery ×5
events ×3
binding ×1
css ×1
height ×1
mouseevent ×1
mouseover ×1
usability ×1
viewport ×1
vimperator ×1