// this e works
document.getElementById("p").oncontextmenu = function(e) {
e = e || window.event;
var target = e.target || e.srcElement;
console.log(target);
};
// this e is undefined
function doSomething(e) {
e = e || window.event;
var target = e.target || e.srcElement;
console.log(target);
}
<p id="p" onclick="doSomething(e)">
<a href="#">foo</a>
<span>bar</span>
</p>
有人问过一些类似的问题.
但在我的代码中,我正在尝试获取被点击的子元素,例如a或span.
那么event作为参数传递给事件处理程序的正确方法是什么,或者如何在不传递参数的情况下在处理程序中获取事件？
我知道addEventListener并且jQuery,请提供一个将事件传递给inline事件处理者的解决方案.
由于IE8不支持getComputedStyle,我们只能使用currentStyle.但是,它不会返回某些属性的实际"计算"值.
例如:
<style type="text/css">
#div {/* no properties are defined here */}
</style>
<div id="div">div</div>
// returns "medium" instead of 0px
document.getElementById('div').currentStyle.borderLeftWidth
// returns "auto" instead of 0px
document.getElementById('div').currentStyle.marginLeft
// returns "undefined" instead of 1
document.getElementById('div').currentStyle.opacity
有没有人在不使用jQuery或其他Javascript库的情况下为所有属性提供跨浏览器解决方案？
我在@import上看到了一些关于覆盖样式的类似问题,人们建议将@import置于底部,但这似乎不适用于此.
--- index.html ---
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
This text should be green.
</body>
--- style.css ---
body {color: red;}
@import url('style-override.css');
--- style-override.css ---
body {color: green;}
上面的示例将输出红色文本,而绿色则是预期的.
在head.css头部之后声明style-override.css将解决问题,但我想在 css文件中使用@import .
在style-override.css中添加!important也会获得预期的结果,但这不是它应该工作的方式.
有谁能解释一下？
文档中有2个脚本
// my_script.js goes first
document.onclick = function() {
alert("document clicked");
};
// other_script.js comes after
// this overrides the onclick of my script,
// and alert will NOT be fired
document.onclick = function() {
return false;
};
为了确保我的click事件不会被其他脚本覆盖,我切换到了addEventListener.
// my_script.js goes first
document.addEventListener("click", function() {
alert("document clicked");
}, false);
// other_script.js comes after
document.addEventListener("click", function() {
return false;
}, false);
现在我又得到了一个问题.由于return false在第二个代码之后定义alert,为什么不阻止警报被调用？
如果我希望我的脚本能够完全控制click事件(比如忽略其他脚本中定义的事件一直返回false),该怎么办？
Object.prototype.doSomething = function(p) {
this.innerHTML = "<em>bar</em>";
this.style.color = "#f00";
alert(p);
};
document.getElementById("foo").doSomething("Hello World");
<div id="foo"><strong>foo</strong></div>
上面的代码工作正常.
但我记得我在某个地方看过这个:Do not mess with native Object.好吧,就像那样.
那么在Object上定义原型函数是否可以？我有什么理由不这样做吗？
我最近阅读了一些关于jQuery性能的文章,我想出了一些奇怪的问题.
可以/应该缓存$(window)吗？
如果我这样做,它会影响resize,scroll,width,scrollTop...等？
可以/应该缓存$(document)吗？
由于我们使用了很多鼠标操作,我应该这样做var doc = $(document);吗？
我可以一直缓存$(this)在一大块代码中吗？
至于var self = $(this);,在什么条件下self可能会有所不同$(this)？
为了在IE 6/7/8上获得CSS3效果(border-radius,box-shadow ...),我正在使用css3pie.
但是,css3pie会css3-container (v1) / css3pie (v2)在DOM中生成一些标记,这会使预期的体系结构失调.这是一个例子:
CSS
pre {
border: 1px solid #aaa;
border-radius: 5px;
behavior: url(pie.htc);
}
HTML
<div class="foo">bar</div>
<p class="getme">paragraph</p>
<pre>preformatted</pre>
jQuery的
// undefined expected: getme
alert($("pre").prev().attr("class"));
// css3-container expected: p
alert($("pre").prev()[0].tagName);
// getme expected: foo
alert($("pre").prev().prev().attr("class"));
// 4 expected: 3
alert($("body").children().size());
// will not set expected: Impact
$("p+pre").css({fontFamily: "Impact"});
// it almost affects all such jQuery selctors
实际生成的源是这样的:
<DIV class="foo">bar</DIV>
<P class="paragraph">paragraph</P>
<css3-container...>
<border...>
<shape...><stroke></stroke><stroke></stroke></shape>
</border>
</css3-container>
<PRE>preformatted</PRE>
有谁遇到过这种问题？任何解决方法？有没有css3pie的替代方案让CSS3在IE 6/7/8上运行？
id title slug summary ------------------------------ 1 title1 slug1 summary1 2 title2 slug2 summary2 3 title3 slug3 summary3 4 title4 slug4 summary4
我正在尝试选择所有字段,同时选择上一行/下一行的id,title和slug
SELECT
title, slug, summary, id as current_id,
(SELECT id FROM table WHERE id < current_id ORDER BY id DESC LIMIT 1) AS prev_id,
(SELECT title FROM table WHERE id < current_id ORDER BY id DESC LIMIT 1) AS prev_title,
(SELECT slug FROM table WHERE id < current_id ORDER BY id DESC LIMIT 1) AS prev_slug,
/*
(SELECT id …好的，有一个与此完全重复的问题，但已经过去了两年了，而且只有一个答案，这并不是真正的解决方案。
所以，我有一个图像（缩略图），其正下方有 2 个按钮：View和Download。
查看将在浏览器中打开图像（缓存）。下载按钮将打开“保存图像”对话框。
现在我使用 PHP 的标头Content-Disposition: attachment;作为下载按钮。
一般来说，访问者会首先点击View按钮进行预览（缩略图不是解决方案，因为需要验证细节和质量），特别是对于我自己的应用程序。
现在，我真的不想通过 PHP 再次读取该文件，因为这需要时间。为了更好的用户体验，是否可以模拟“图片右键->图片另存为”，弹出下载对话框，访问者只需点击一下即可下载？
当你mousedown在图像上,mousemove稍微移动鼠标()然后释放(mouseup),mouseup不用jQuery触发.
jsfiddle:http://jsfiddle.net/kVFTZ/
为什么是这样？如何在移动图像时使其工作？