jquery - 向导表单 chrome 扩展

Question

在过去的几天里，我一直在尝试通过在 chrome 扩展上使用 jquery 来实现一个向导表单，但这似乎是不可能的（对我来说）。我试图调整一些库，例如

http://st3ph.github.io/jquery.easyWizard/

和

http://www.dbarnes.info/jWizard/

谁能告诉我如何在 chrome 扩展上实现向导表单？或者请举一些例子。

非常感谢您

Answer 1

我没有查看您引用的库，但这是一个非常简单的方法：

<div id="one">Panel 1 form content<button id="button_one">Next</button></div>
<div id="two">Panel 2 form content<button id="button_two">Next</button></div>
<div id="three">Panel 3 form content<button id="button_three">Next</button></div>

首先隐藏除第一个 div 之外的所有内容。设置 button_one 的点击处理程序来隐藏 div 1 并显示 div 2，依此类推。最后一个面板可能有一个“完成”按钮，用于提交所有内容，或者您​​想做的任何事情。一旦你完成了这项工作，你就可以开始对过渡、标签行为和更好的 CSS 产生兴趣。

顺便说一句，在尝试 Chrome 扩展程序之前，您应该首先考虑在常规网页上进行原型设计。“在 Chrome 扩展程序上”非常广泛，它本身并没有多大意义；它可以是一个弹出窗口，它可以被设计用来增强特定的网页，它可以是任何网页上的覆盖。我们不知道您的问题，这就是为什么在常规网页上进行一些非常简单的工作是很好的，然后您可以适应您的扩展程序。这里概述的简单方法应该是您项目的良好基础。