Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
580 views
in Technique[技术] by (71.8m points)

javascript - 在Firefox插件弹出窗口中禁用任何对象的拖动(Disable drag for any object in firefox addon popup)

I am developping an extension on Chrome / Firefox which has a popup composed of different graphic elements.

(我正在Chrome / Firefox上开发扩展程序,该扩展程序包含由不同图形元素组成的弹出窗口。)

I don't want user to drag and drop these items from this popup.

(我不希望用户从此弹出窗口中拖放这些项目。)

To disable drag in Chrome, I can use this css code:

(要在Chrome中禁用拖动,我可以使用以下CSS代码:)

* {
    user-drag: none;
    -ms-user-drag: none;
    -moz-user-drag: none;
    -webkit-user-drag: none;

    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;

    text-decoration: none;
}

But this doesn't work in Firefox.

(但这在Firefox中不起作用。)

Is there any css attribute which could work in this case?

(在这种情况下是否可以使用任何CSS属性?)

Here is a minimal version: https://drive.google.com/open?id=0B4k6nM18722gNjY5VjVpREhpRTQ

(这是一个最低版本: https : //drive.google.com/open?id=0B4k6nM18722gNjY5VjVpREhpRTQ)

  ask by Nucktrooper translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

Disable Dragging via Brute Force:(通过蛮力禁用拖动:)

To disable dragging on the entire popup/document, you can do any one of the following:

(要禁用在整个弹出窗口/文档上的拖动,可以执行以下任一操作:)

  • Add the following lines to your popup.js file:

    (将以下行添加到您的popup.js文件中:)

function noDrag(event) {
    event.preventDefault();
}
document.addEventListener('dragstart',noDrag,true);
  • Or add this line to popup.js :

    (或将此行添加到popup.js :)

document.addEventListener('dragstart',function(event){event.preventDefault();},true);
  • Or change the <html> line in popup.html to:

    (或将popup.html中<html>更改为:)

<html ondragstart='event.preventDefault();'>

My personal preference is to use the named noDrag function.

(我个人的喜好是使用命名的noDrag函数。)

The named function instead of the closure merely because, at some point in the future, I might want to be selective about which elements have drag disabled.

(命名函数而不是闭包,仅仅是因为在将来的某个时候,我可能想选择禁用拖动的元素。)

Having it named allows the same function to be re-used, or removed as a listener from an element, should that be desirable.

(如果需要的话,将其命名可允许重用相同的功能,或者从元素中将其用作侦听器。)

The JavaScript instead of the HTML because A) you already have a JavaSctipt file for the popup and B) my opinion of the onxxxxx event attributes/properties is that they should be avoided when reasonable.

(用JavaScript代替HTML,因为A)您已经有一个JavaSctipt文件用于弹出窗口,B)我对onxxxxx事件属性/属性的onxxxxx是,在合理的情况下应避免使用它们。)

If there was not already a JavaScript file associated with this popup, I would use the HTML ondragstart method.

(如果还没有与此弹出窗口关联的JavaScript文件,我将使用HTML ondragstart方法。)

How it is supposed to work:(应该如何工作:)

The following does not disable dragging on <a> and <img> elements.

(以下内容不会禁止在<a><img>元素上拖动。)

The specs and documentation say that it is supposed to work to disable dragging.

(规范和文档说应该可以禁用拖动。)

I need to delve further into the Firefox source code to figure out why it is not working.

(我需要进一步研究Firefox源代码,以弄清为什么它不起作用。)

In Firefox (and the HTML specification), the element being draggable is controlled by the draggable attribute .

(在Firefox(和HTML规范)中,可拖动的元素由draggable属性控制。)

For images and links, the default value is true .

(对于图像和链接,默认值为true 。)

For everything else, the default is false .

(对于其他所有内容,默认值为false 。)

You will either need to have draggable="false" on all such elements in your HTML, or use JavaScript to setAttribute('draggable',false) , or element.draggable = false;

(您可能需要在HTML中的所有此类元素上都具有draggable="false" ,或者使用JavaScript来setAttribute('draggable',false)element.draggable = false;)

on all such elements.

(在所有这些元素上。)

Firefox does not have a CSS property which can be used to control if an element is draggable.

(Firefox没有CSS属性,可用于控制元素是否可拖动。)

For more information see:

(有关更多信息,请参见:)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...