JQuery -切换UI部分的最佳方式
JQuery - best way to swap in and out parts of the UI
"保留"answers"重新显示"html页面的部分,以及您设置的jquery事件处理程序的最佳方法是什么?
更多细节:
我正在写一个"单页javascript应用程序",允许用户执行两种不同的计算。用户通过单击单选按钮来选择他们想要的计算。
当他们单击单选按钮A时,UI的很大一部分需要显示适当的html控件(和jquery事件处理程序),允许用户输入计算A的参数。
同样,如果用户单击单选按钮B,则该段页面需要显示允许用户输入计算B的参数的所有控件(及其关联的jquery事件处理程序)。
我的问题是如何最好地处理计算A和B的html控件及其相关的jquery事件处理程序的交换?
我曾想过只是使用jquery的。html()来获取和设置页面的参数部分,但我认为这不会保留我为这些控件设置的任何事件处理程序。对吗?在这种情况下,当用户在计算之间切换时,我需要重新连接事件处理程序,或者做其他事情。
(在本质上,我认为我想做的是能够保留一块dom(希望包括jquery事件处理程序),但我不写大量的jquery和我不确定如何接近…我想知道,如果我能得到一个页面的整个参数部分表示为一个jquery节点,并保存(到一个js变量),并恢复它,根据需要,如果这样做的技巧?
谢谢你的建议!迈克尔。
老实说,通常hide()
/show()
元素比删除/重新添加它们更容易。
为第一个计算元素添加calculation-1
类,为第二个计算元素添加calculation-2
类。这将使您通过$('.calculation-1')
和$('.calculation-2
获得所有计算1和2元素的jQuery变量。
然后,您可以为hide()
和show()
相应的元素添加一个事件处理程序。
如果您使用html()
,您将丢失绑定到元素子元素的事件。除非你将你的处理程序附加到你的祖先,否则不要删除。
还可以使用detach()
,它将从DOM中删除元素,但保留添加的事件处理程序。但是,如果您的元素遍布DOM,则很难跟踪它们的原始位置,并且TBH的工作比它的价值更多。
- 在localhost Dev Box上测试JSONP请求的最佳方式
- 为react组件传递道具的最佳方式
- 让Webpack管理Quirky AMD定义的最佳方式
- 在承诺链中处理早期回报的最佳方式
- 在ng重复循环中显示条件内容的最佳方式是什么
- 在phonegap中为android调用onload函数的最佳方式
- 链接两个网页或网络应用程序的最佳方式
- 什么's是连接供应商js文件的最佳方式
- 什么's是在javascript中迭代项的最佳方式
- 在node.js中编写单元测试的最佳方式是什么
- 在页面上记录数据并实现pushstate()的最佳方式
- 使用AJAX在Rails中提交动态表单的最佳方式是什么
- 什么'这是加载jQuery的最佳方式
- 将大数组(字符串和类型数组的混合物)存储到blob或文件中/从blob或文件检索大数组的最佳方式
- 在网站上显示.mov作为加载屏幕的最佳方式
- 使用Angular存储用户以前是否选中过复选框,然后再调用它的最佳方式是什么
- 以角度渲染表中数据的最佳方式
- 删除集合中旧邮件/帖子的最佳方式
- 显示全屏Ajax加载程序的最佳方式
- PHP和JS中表单验证的最佳方式