jQuery UI Droppable disable()用法及代碼示例

jQuery Mobile 是一種基於 Web 的技術，用於為可以在所有類型的智能手機、平板電腦和台式機上訪問的網站製作響應式內容。

在本文中，我們將使用 jQuery Mobile Droppable disable() 方法來禁用 droppable，它也不接受任何參數。

用法:

$(“.selector”).droppable( “disable” );

參數：此方法不接受任何參數。

CDN 鏈接：以下是您的項目需要的一些 jQuery Mobile 腳本，因此請將它們添加到您的項目中。

<link rel=”stylesheet” href=”https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css”>
<script src=”https://code.jquery.com/jquery-1.12.4.js”></script>
<script src=”https://code.jquery.com/ui/1.12.1/jquery-ui.js”></script>

例：這個例子描述了 jQuery Mobile Droppable disable() 方法的使用。

HTML


<!DOCTYPE html>
<html lang = "en">
<head>
  <meta charset = "utf-8">
  <link href = "https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css"
     rel = "stylesheet">
  <script src = "https://code.jquery.com/jquery-1.10.2.js"></script>
  <script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    
  <style>
     .dragg { 
        width:90px; height:50px;
        border:1px solid black;  
        background-color:blue;
     }
     .dropp2, .dropp3 { 
        width:200px; height:50px;
        border:1px solid black; 
        float:center;
        background-color:green;
     }
  </style>
    
  <script>
     $(function() {
        $( ".dragg" ).draggable();
        $( ".dropp2" ).droppable({
           drop:function( event, ui ) {
              $( this )
              .find( "p" )
              .html( "Dropped!" );
           }
        });
          
        $( ".dropp3" ).droppable("disable");
              
        $( ".dropp3" ).droppable({
           drop:function( event, ui ) {
              $( this )
              .find( "p" )
              .html( "Dropped!" );
           }
        });
     });
  </script>
</head>
  
<body>
    <center>
        <h1 style = "color:green;">GeeksforGeeks</h1>
      
        <h3>jQuery UI Droppable disable() method</h3>
          
        <div class = "dragg">
            <p>Drag</p>
        </div>
        <br><br>
        <div class = "dropp2">
            <p>Drop here</p>
        </div>
        <br><br>
        <div class = "dropp3">
            <p>Disable - Can't Drop Here</p>
        </div>
    </center>
</body>
  
</html>

輸出：

參考：https://api.jqueryui.com/droppable/#method-disable

相關用法

注：本文由純淨天空篩選整理自SHUBHAMSINGH10大神的英文原創作品 jQuery UI Droppable disable() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。