jQuery UI Draggable option() 方法

jQuery Mobile是一种基于 Web 的技术，可用于为可在所有类型的智能手机、平板电脑和台式机上访问的网站制作响应式内容。

在本文中，我们将学习jQuery Mobile Draggable option()方法。使用此方法，我们可以获取、设置或更新 Draggable 小部件的任何参数值。我们还可以使用此方法将所有选项作为键值对获取。

句法：

1.如果用户想要任何选项的值，选项名称应该在option(optionName ) 方法中传递。 optionName应该是字符串类型。

var isEnhanced = $("Selector").draggable("option", "enhanced");

范围：

• optionName：此参数是我们需要以字符串形式传递的输入，我们需要为其获取值。
• 返回类型：我们根据选项数据类型得到各自的返回值。

2.获取所有选项作为键值对，只需要调用option()方法，不传参数即可。

var options= $("Selector").draggable("option");

返回类型：该方法以optionName-optionValue对集合的形式返回所有选项的键值对列表。

3 、设置任意选项的值，只需要调用option(optionName, value) ，以optionName和value作为参数。

$("Selector").draggable("option", "enhanced", "false");

参数：

• optionName：选项方法需要选项名称作为第一个参数，该参数为字符串类型。
• value：选项方法需要选项名称作为第二个参数，该参数为字符串类型。

4.我们也可以设置多个选项而不是只设置一个，你只需要调用option(options)方法，其中options是选项列表。

$("Selector").draggable("option", {enhanced: false, disabled: true});

范围：

• option：是optionName-value对作为输入的map，用来设置传递的值对应的options，属于object类型。

CDN 链接：添加 遵循您的项目将需要的 jQuery Mobile 脚本。

示例：此示例演示了jQuery Mobile Draggable option()方法。

HTML

  

    
    
    
    
    
    
  
    
        .drag
        {
            width:90px;
            height:50px;
            border:1px solid black;
            background-color:blue;
        }
        .drop2
        {
            width:200px;
            height:50px;
            border:1px solid black;
            float:center;
            background-color:green;
        }
    
  
    
        $(function () {
            $(".drag").draggable();
            $(".drop2").droppable({
                drop: function (event, ui) {
                    $(this).find("p").html("Dropped!");
                }
            });
        });
  
        $(function () {
            $("#btn").on('click', function () {
                var options = $(".drag").draggable("option");
                document.getElementById('spanID').innerHTML +=
                    "No of key/value pair present : " +
                    Object.keys(options).length;
            });
        });
    

  

    
        GeeksforGeeks
  
        jQuery UI Draggable option() method
  
        
            Drag
  
        
        
        
            Drop here
  
        
        
        
        
    

输出：

jQuery Mobile Draggable option() 方法

参考： https://api.jqueryui.com/draggable/#method-option