Javascript 是否禁用Opera的Ctrl单击以编程方式保存图像?

Javascript 是否禁用Opera的Ctrl单击以编程方式保存图像?,javascript,html,opera,Javascript,Html,Opera,我正在开发一个web应用程序,它模拟桌面上的通用文件浏览器,但用于上传的文件。它为用户提供文件夹的多个视图,例如列表、详细信息和缩略图。它允许用户使用Shift和Ctrl-click组合,一次选择多个文件进行批量文件操作,类似于传统的文件浏览器 不幸的是,Opera的默认行为是在按住Ctrl键单击图像时下载图像,这会破坏在缩略图视图中按住Ctrl键单击的多选功能 我知道Opera允许您为自己的浏览器禁用此功能,但从用户体验的角度来看,我希望避免在页面上放置一条消息,指示用户如何执行此操作,或者更

我正在开发一个web应用程序,它模拟桌面上的通用文件浏览器,但用于上传的文件。它为用户提供文件夹的多个视图,例如列表、详细信息和缩略图。它允许用户使用Shift和Ctrl-click组合,一次选择多个文件进行批量文件操作,类似于传统的文件浏览器

不幸的是,Opera的默认行为是在按住Ctrl键单击图像时下载图像,这会破坏在缩略图视图中按住Ctrl键单击的多选功能

我知道Opera允许您为自己的浏览器禁用此功能,但从用户体验的角度来看,我希望避免在页面上放置一条消息,指示用户如何执行此操作,或者更糟糕的是,不必向Opera用户提供多选功能


是否有一个meta标记或一些javascript向导,我可以用来告诉Opera在用户按Ctrl键时不要下载图像?

这里有一个小代码片段说明了这个问题。请注意,这是一个快速测试,在IE中不起作用:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css"><!--
.selected{
    border: 3px solid navy;
}
--></style>
<script type="text/javascript"><!--
window.onload = function(){
    var pictures = document.getElementsByTagName("img");
    for(var i=0, len=pictures.length; i<len; i++){
        pictures[i].onclick = function(e){
            e.target.className = e.target.className=="selected" ? "" : "selected";
        }
    }
}
//--></script>
</head>
<body>

<ul>
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li>
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li>
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li>
</ul>

</body>
</html>
背景图像似乎不受影响:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css"><!--
.selected{
    border: 3px solid navy;
}
div{
    width: 32px;
    height: 32px;
    background: white url(http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG) left top no-repeat;
}
--></style>
<script type="text/javascript"><!--
window.onload = function(){
    var pictures = document.getElementsByTagName("div");
    for(var i=0, len=pictures.length; i<len; i++){
        pictures[i].onclick = function(e){
            e.target.className = e.target.className=="selected" ? "" : "selected";
        }
    }
}
//--></script>
</head>
<body>

<ul>
    <li><div></div></li>
    <li><div></div></li>
    <li><div></div></li>
</ul>

</body>
</html>

因此,到目前为止,我最好的解决方法是使用任何其他标记,而不是。如果我找到更好的,我会回来报告。

单击文件并选择它是单独的操作吗?@lvaro,不带修改器的正常单次左键单击会选择一个文件。按住Shift键单击可选择最近选定的文件和按住Shift键单击的文件之间的所有文件。Ctrl单击可添加或删除单个文件中的选择。这正是普通文件浏览器的工作方式。JavaScript并不是用来做这类事情的——而且当用户真的打算使用Ctrl-click保存图像时,更改默认行为肯定不是一件好事。您是否尝试附加一个点击处理程序并返回false?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css"><!--
.selected{
    border: 3px solid navy;
}
div{
    width: 32px;
    height: 32px;
    background: white url(http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG) left top no-repeat;
}
--></style>
<script type="text/javascript"><!--
window.onload = function(){
    var pictures = document.getElementsByTagName("div");
    for(var i=0, len=pictures.length; i<len; i++){
        pictures[i].onclick = function(e){
            e.target.className = e.target.className=="selected" ? "" : "selected";
        }
    }
}
//--></script>
</head>
<body>

<ul>
    <li><div></div></li>
    <li><div></div></li>
    <li><div></div></li>
</ul>

</body>
</html>