ondrag ਈਵੈਂਟ
ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ
ondrag ਈਵੈਂਟ ਐਲੀਮੈਂਟ ਜਾਂ ਟੈਕਸਟ ਚੋਣ ਸਰਕਰਾਂ ਵਾਲੇ ਹੋਣ ਤੇ ਟ੍ਰਿਗਰ ਹੁੰਦਾ ਹੈ。
ਕੋਰਸ ਦੀ ਸਿਫਾਰਸ਼ ਕੀਤੀ ਜਾਂਦੀ ਹੈ: HTML5 ਟ੍ਰੈਕਟੂਰ ਦੀ ਸਿਫਾਰਸ਼ ਕੀਤੀ ਜਾਂਦੀ ਹੈ:
ਟਿੱਪਣੀਆਂ:ਜੇਕਰ ਐਲੀਮੈਂਟ ਸਰਕਰਾਂ ਵਾਲਾ ਬਣਾਉਣਾ ਹੈ, ਤਾਂ ਵਿਸ਼ਵ ਵਿੱਚ HTML ਟੂਰ ਵਿੱਚ ਵਰਤੋਂ ਕਰੋ HTML5 draggable ਅਤੀਤ。
ਸੁਝਾਅ:ਮੂਲਤਵੀ ਤੌਰ 'ਤੇ, ਲਿੰਕ ਅਤੇ ਚਿੱਤਰ ਸਰਕਰਾਂ ਵਾਲੇ ਹਨ, draggable ਅਤੀਤ ਦੀ ਜ਼ਰੂਰਤ ਨਹੀਂ ਹੈ。
ਟ੍ਰੈਜ਼ ਅਤੇ ਡਰਾਗ ਓਪਰੇਸ਼ਨ ਦੇ ਵੱਖ-ਵੱਖ ਪੜਾਵਾਂ 'ਚ, ਕਈ ਈਵੈਂਟਸ ਵਰਤੇ ਜਾਂਦੇ ਹਨ ਅਤੇ ਹੋ ਸਕਦੇ ਹਨ:
ਟਰੈਜ਼ ਟਾਰਗੇਟ (ਸਰੋਤ ਐਲੀਮੈਂਟ) 'ਤੇ ਟ੍ਰਿਗਰ ਹੋਣ ਵਾਲੇ ਈਵੈਂਟਸ:
- ondragstart - ਜਦੋਂ ਯੂਜ਼ਰ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਸ਼ੁਰੂ ਕਰਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
- ondrag - ਜਦੋਂ ਐਲੀਮੈਂਟ ਸਰਕਰਾਂ ਵਾਲਾ ਹੈ ਤਾਂ ਹੋਇਆ
- ondragend - ਜਦੋਂ ਯੂਜ਼ਰ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਪੂਰਾ ਕਰਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
ਪਾਸਟ ਟਾਰਗੇਟ 'ਤੇ ਟ੍ਰਿਗਰ ਹੋਣ ਵਾਲੇ ਈਵੈਂਟਸ:
- ondragenter - ਜਦੋਂ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਪਾਸਟ ਟਾਰਗੇਟ ਵਿੱਚ ਆਉਂਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
- ondragover - ਜਦੋਂ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਪਾਸਟ ਟਾਰਗੇਟ 'ਤੇ ਰਹਿੰਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
- ondragleave - ਜਦੋਂ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਪਾਸਟ ਟਾਰਗੇਟ ਤੋਂ ਹਟਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
- ondrop - ਜਦੋਂ ਸਰਕਰਾਂ ਵਾਲਾ ਐਲੀਮੈਂਟ ਪਾਸਟ ਕੀਤੇ ਗਏ ਪਾਸਟ ਟਾਰਗੇਟ 'ਤੇ ਰਹਿੰਦਾ ਹੈ ਤਾਂ ਹੋਇਆ
ਟਿੱਪਣੀਆਂ:ਜਦੋਂ ਐਲੀਮੈਂਟ ਸਰਕਰਾਂ ਵਿੱਚ ਲਿਆ ਜਾਂਦਾ ਹੈ ਤਾਂ ondrag ਈਵੈਂਟ ਹਰ 350 ਮਿਲੀਸਕਵਾਂਟ ਵਿੱਚ ਇੱਕ ਵਾਰ ਟ੍ਰਿਗਰ ਹੁੰਦਾ ਹੈ。
ਉਦਾਹਰਣ
ਜਦੋਂ <p> ਐਲੀਮੈਂਟ ਸਰਕਰਾਂ ਤੋਂ ਸਰਕਰਾਂ ਵਿੱਚ ਲਿਆ ਜਾਂਦਾ ਹੈ ਤਾਂ JavaScript ਚਲਾਉਣਾ:
<p draggable="true" ondrag="myFunction(event)">Drag me!</p>
ਪੇਜਿਲੇ ਨਜ਼ਦੀਕ ਹੋਰ TIY ਉਦਾਹਰਣ ਹਨ。
ਗਰਮਤਾ:
ਜਿਵੇਂ ਕਿ HTML ਵਿੱਚ:
<element ondrag="myScript">
ਜਿਵੇਂ ਕਿ JavaScript ਵਿੱਚ:
object.ondrag = function(){myScript};
ਜਿਵੇਂ ਕਿ JavaScript ਵਿੱਚ, addEventListener() ਮੈਥਡ ਦੀ ਵਰਤੋਂ ਕਰਕੇ:
object.addEventListener("drag", myScript);
ਟਿੱਪਣੀਆਂ:ਇੰਟਰਨੈੱਟ ਐਕਸਪਲੋਰਰ 8 ਜਾਂ ਪੁਰਾਣੀ ਸੰਸਕਰਣ ਮਦਦ ਨਹੀਂ ਦਿੰਦੇ addEventListener() 方法。
技术细节
冒泡: | 支持 |
---|---|
可取消: | 支持 |
事件类型: | DragEvent |
支持的 HTML 标签: | 所有 HTML 元素 |
DOM 版本: | Level 3 Events |
浏览器支持
表中的数字注明了完全支持该事件的首个浏览器版本。
事件 | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
ondrag | 4.0 | 9.0 | 3.5 | 6.0 | 12.0 |
更多实例
对所有可能的拖放事件的演示:
Drag me!
Drop here!