使用命名空间和空选择器调用小部件的安全方法

Question

jQueryUi $.widget 工厂创建了类，可用于两种方式：

$("mySelector").myWidget(myOptions)；和
$.myNamespace.myWidget(myOptions, mySelector).

第一种方式不支持小部件的命名空间，所以我更喜欢使用第二种方式。我的问题是当 mySelector 不匹配任何 html 元素（即 $(mySelector).length == 0）时，支持命名空间的版本会抛出异常。有什么漂亮的方法可以避免这个问题吗？我正在开发一个内部框架，不想有不必要的 if 条件。

作为参考，我已经阅读（并且我想我理解了）：

Answer 1

这两个调用并不完全相同。第一个将遍历 selector 的每个元素并应用 widget，但第二个不会。参见：

$.ui.draggable('', 'div')

div {
  width: 100px;
  height: 100px;
  border: solid black;
}
.ui-draggable {
  border: solid blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<div>
</div>
<div>
</div>

要使其等效，您需要使用 $.each，这会将它应用于选择器中的所有元素并消除您的错误。

例如这样：

$('div').each(function(){
 $.ui.draggable('', this)
});

$('.empty').each(function(){
 $.ui.draggable('', this)
});

div
{
  width: 100px;
  height: 100px;
  border: solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
 <script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<div>
</div>
<div>
</div>

使用命名空间和空选择器调用小部件的安全方法

Safe way to call a widget with namespace, with empty selector

javascript

jquery

jquery-ui

widget