js - 如何命名这段代码？

Question

我正在尝试使用命名空间，但可以让它运行起来。 我尝试使用mdd = {}包装所有代码，并且我尝试将$(document).ready(中的所有内容与var MDD = {}包装在一起，但都没有效果。

如何为此代码添加命名空间？

<script type="text/javascript">
  $(document).ready( function() {
    $("#categories").sortable({
      revert: true,
      receive: function(evt, ui) {
        ui.item.remove();
        if ( $('#list_to_process li').length == 0) {
          $('#list_to_process').remove();
        }
      }
    });
    $("li.to_process").draggable( {
      connectToSortable: "#categories",
      helper: "clone",
      revert: "invalid"
    });
  });
</script>

Answer 1

如果您正在尝试组织代码，我建议如下：

• 在之外创建名称 <{strong> $(document).ready（在我的示例中使用Revealing module pattern）。
• 在$(document).ready打电话给你的代码。

示例：

$(function(){
    MDD.init();
});

var MDD = function () {
  var init = function () {
    $("#categories").sortable({
      revert: true,
      receive: function(evt, ui) {
        ui.item.remove();
        if ( $('#list_to_process li').length == 0) {
          $('#list_to_process').remove();
        }
      }
    });
    $("li.to_process").draggable( {
      connectToSortable: "#categories",
      helper: "clone",
      revert: "invalid"
    });
  };
  return {
    init : init
  }
}();

Answer 2

JQuery的.sortable和.draggable调用是方法，而不是事件处理程序。据我所知，它们不能被命名空间。

但是，jQuery的$(document).ready(... 是一个事件处理程序，因此您可以命名它，但前提是它适用于.on方法。请注意，之前我没有对此进行过测试，但如果可行的话，那么下面应该可以使用：

$(document).on("ready.namespace", function() {
    ...
});