Javascript 扩展自举模型

对于我的一个项目，我想扩展twitter引导模式窗口的功能

我希望我的模态窗口能够获得JavaCardLayout的功能。 对于那些不知道的人，CardLayout允许一个容器（在我们的例子中是模态窗口）接受多个card Children（在我们的例子中是div）。每个子级都获得一个索引，容器最初显示索引为“0”的子级。CardLayout界面包含“previous（）、next（）、first（）、last（）”功能，可根据索引更改显示的卡

这是一个HTML模板，我想用它生成一个包含4张“卡片”的“卡片模式”：

×
模态头
这是初始状态
这是第一步
这是第二步
这是最终状态

因为我对JS还很陌生，所以我希望作为练习，尽量使它具有通用性和可重用性。 理想的情况是有一个card-modal.js文件，我可以把它放在我的project js文件夹中，以便随时创建其中一个

我在两个方向之间犹豫不决： -扩展模态类（使用coffeescript“extends”关键字），因为CardModal毕竟是模态。 -创建一个单独的类，该类只处理对上一个/下一个按钮的响应

这两个选项的初始化有什么不同吗？（开发人员需要编写什么才能真正启动所需的对象）

---

我只是在寻找一个“你会怎么做的答案”从一个更有经验的开发人员。因此，实际展示“为什么此解决方案比此解决方案更好”会获得额外的分数。

JavaScript有一个基于函数原型的继承模型；这不同于在Python/Java/等中看到的“传统”基于类的继承模型。从绝对意义上讲，它也更难使用和学习（IMHO）。这就是为什么框架和编译器（比如CoffeeScript）有自己的内置类继承系统

这些特别的JS类继承系统的缺点是，它们通常不能与其他JS继承系统交叉兼容。在这个特定的实例中，Modal类不是CoffeeScript类。因此，我强烈建议不要试图用CoffeeScript来扩展它，因为这种方式是疯狂的

我建议您选择#2-构建功能，分别切换上一个/下一个。您应该将您的CardLayout开发为独立的Javascript/jQuery，该Javascript/jQuery需要提供一个

元素，该元素包含

N

元素，这样无论

卡容器

元素位于DOM中的何处，您都可以使用

setupCardLayout（$（'.card container'））

创建它

然后，要将它与引导模式集成，只需在模式显示时侦听事件

$('#id-of-modal').on 'shown', ()->
    setupCardLayout($(this))

---

JavaScript具有基于功能原型的继承模型；这不同于在Python/Java/等中看到的“传统”基于类的继承模型。从绝对意义上讲，它也更难使用和学习（IMHO）。这就是为什么框架和编译器（比如CoffeeScript）有自己的内置类继承系统

这些特别的JS类继承系统的缺点是，它们通常不能与其他JS继承系统交叉兼容。在这个特定的实例中，Modal类不是CoffeeScript类。因此，我强烈建议不要试图用CoffeeScript来扩展它，因为这种方式是疯狂的

我建议您选择#2-构建功能，分别切换上一个/下一个。您应该将您的CardLayout开发为独立的Javascript/jQuery，该Javascript/jQuery需要提供一个

元素，该元素包含

N

元素，这样无论

卡容器

元素位于DOM中的何处，您都可以使用

setupCardLayout（$（'.card container'））

创建它

然后，要将它与引导模式集成，只需在模式显示时侦听事件

$('#id-of-modal').on 'shown', ()->
    setupCardLayout($(this))

---

我甚至不能把：$（'.modal class container'）。在“显示”上，（）->setupCardLayout（$（this））放在我的“lib”文件中，这样它就会自动被lib触发吗？当然可以。但是，您将您的cardLayout系统绑定到只在

.modal

元素中工作。我甚至不能将：$（'.modal class container'）。在'show'上，（）->setupCardLayout（$（this））放在我的“lib”文件中，以便lib自动触发它吗？当然可以。但是，您要绑定到cardLayout系统，以便仅在

.modal

元素中工作。