ホームページ >ウェブフロントエンド >CSSチュートリアル >HTML 要素でのドラッグ アンド ドロップを防ぐにはどうすればよいですか?
HTML 要素でのドラッグ アンド ドロップを防ぐにはどうすればよいですか?
- Barbara Streisandオリジナル
- 2024-11-28 16:54:191054ブラウズ
HTML 要素でのドラッグ アンド ドロップの禁止: 包括的なソリューション
ウィンドウ システムを使用して複雑な Web アプリケーションを開発していると、時折、障害物。具体的には、ブラウザのデフォルトのドラッグ アンド ドロップ動作が、意図したサイズ変更操作を妨げる可能性があります。これを解決するには、次の解決策の採用を検討してください。
特定の要素のドラッグ アンド ドロップを無効にする
HTML イベントの ondragstart および ondrop を利用することで、ドラッグを無効にすることができます。特定の HTML 要素内で -and-drop します。次の属性を関連する要素に組み込みます:
<div>
または、ドキュメント本文全体で無効にして、必要に応じて再度有効にすることもできます:
<body ondragstart="return false;" ondrop="return false;"></body>
jQuery解決策
jQuery を使用して同じ結果を達成するには、 raggable() メソッド:
$(document).ready(function() {
$('#draggable').draggable({
disabled: true
});
});
動的有効化/無効化
ドラッグ アンド ドロップ機能を動的に切り替える必要があるシナリオでは、enable( jQuery の) および disable() メソッド:
$('#draggable').draggable('disable');
...
$('#draggable').draggable('enable');
包括的機能
このアプローチは、ユーザーがマウス ボタンを押している間、ブラウザーのテキスト選択とドラッグ アンド ドロップを効果的に無効にします。マウスボタンを放すと機能が復元されます。よりきめ細かい制御を行うには、ドラッグ アンド ドロップが無効になる要素を指定できます。
以上がHTML 要素でのドラッグ アンド ドロップを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。