如何使用jQuery UI开发Web程序(3)

 时间:2026-02-15 03:34:21

1、访问jQuery UI官方网站Demo页面,如下图所示。

如何使用jQuery UI开发Web程序(3)

2、    本经验学习Widgets(窗口小部件),Widgets are full-featured UI controls that bring the richness of desktop applications to the Web. All widgets provide a solid core with plenty of extension points for customizing behavior, as well as full theming support.(Widgets是全特性UI控件,它们给wWeb应用程序带来了桌面应用程序的丰富性。)

      jQuery UI 窗口小部件由以下部分组成,分别为Accordion、Autocomplete、Button、Datepicker、Dialog、Menu、Progressbar、Selectmenu、Slider、Spinner、Tabs、Tooltip等,如下图所示。

如何使用jQuery UI开发Web程序(3)

3、Widgets第1个为Accordion(手风琴)。Click headers to expand/collapse content that is broken into logical sections, much like tabs. Optionally, toggle sections open/closed on mouseover。如下图所示。

如何使用jQuery UI开发Web程序(3)

如何使用jQuery UI开发Web程序(3)

4、Widgets第2个为Autocomplete(自动完成)。The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.

如何使用jQuery UI开发Web程序(3)

如何使用jQuery UI开发Web程序(3)

5、Widgets第3个为Button(按钮)。Enhances standard form elements like buttons, inputs and anchors to themeable buttons with appropriate hover and active styles.

如何使用jQuery UI开发Web程序(3)

如何使用jQuery UI开发Web程序(3)

6、Widgets第4个为Datepicker(日期控件)。The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.

如何使用jQuery UI开发Web程序(3)

如何使用jQuery UI开发Web程序(3)

  • 如何使用jQuery UI开发Web程序(14)
  • Web开发中如何应用Jquery UI
  • 如何使用JQuery
  • jquery weui的使用
  • jquery weui怎么使用,jquery weui的使用
  • 热门搜索
    云南什么时候去最好 兰贵人属于什么茶 碧波荡漾是什么意思 大方之家的意思 忍俊不禁是什么意思 shirt是什么意思中文 hrd是什么意思 nice的意思 三长两短的意思 wing是什么意思