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。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。