使用javascript访问`draggable`属性

时间:2013-04-04 08:57:38

标签: javascript html html5 draggable

所以问题是:你怎么能这样做?我想将draggable属性更改为"false",以便先前可拖动的元素将丢失此属性。

我会给你一个div,所以你将有一些东西可以开始:

     <div id="div1"  draggable="true" ondragstart="drag(event) "onDblClick="edit('div1')">
     </div>

5 个答案:

答案 0 :(得分:12)

document.getElementById('div1').setAttribute('draggable', false);

var elem = document.getElementById('div1');
elem.setAttribute('draggable', false);

如果您希望该属性完全消失,请使用

elem.removeAttribute('dragable');

答案 1 :(得分:4)

如果您使用jQuery,有很多方法:

    $('#div1').attr('dragabble'); //returns with the value of attribute
    $('#div1').attr('dragabble','false'); //sets the attribute to false

Native JS:

    document.getElementById('div1').getAttribute('draggable'); //returns the value of attr
    document.getElementById('div1').setAttribute('draggable', 'false'); //set the value of attr

答案 2 :(得分:2)

您可能希望使用jquery-ui draggable组件来实现您所需的功能.. 或者如果您在Dev环境中拥有jquery库,您可以使用以下代码

  

$( “#DIV1”)ATTR( '可拖动',假);

或使用javascript我们可以按照以下方式执行

  

document.getElementById('div1')。setAttribute('draggable','false');

答案 3 :(得分:1)

将属性draggable设置为true后,您通常希望处理dragstart事件。要在原生JS中做到这一点:

elem.addEventListener('dragstart', ev => {
  // dragstart handlings here
  }, false)

答案 4 :(得分:0)

我参加聚会有点晚了,但是为什么我们不只是想写这样的东西?

var el = document.createElement('div');
el.draggable = false;

似乎适合我使用该属性。