Easyui Foundation Learning (i)-Basic components

I. Overview

The jquery Easyui is a set of jquery-based UI plug-ins, and the goal of jquery Easyui is to make it easier for web developers to create a feature-rich and beautiful UI interface. Developers do not need to write complex JavaScript, and do not need to have a deep understanding of CSS styles, developers need to understand only a few simple HTML tags.

jquery Easyui is a plugin based on the UI interface of jquery, the function is relatively not extjs powerful, but the page is also pretty good, while the page supports a variety of themes to meet the user's preferences for different styles of the page. Some features are also sufficient for developers to use, with a lighter weight relative to ExtJS.

JQuery Easyui has the following features:

(1) A collection based on the jquery user interface plug-in.

(2) Provide the necessary functions for some JS applications that are currently used for interaction.

(3) The Easyui supports two rendering modes, $ (' #p '), respectively, in JavaScript mode. Panel ({...}) and HTML markup, lass= "Easyui-panel".

(4) Support HTML5 (via Data-options attribute).

Second, how to load the UI component

There are two ways to load: Load Using the class mode, and use the JS call to load.

1. Loading using class mode

     format: easyui-component Name

<style= "height:100%;width:100%">                <   Class= "Easyui-dialog"  Title= "caption"  style= "Height:200px;width: 400px ">               Here is the          content </div>    </ Body >

Effect:

2. Loading with JS call

JS Code

$ (function () {$ ("#myDialog"). Dialog ({title: ' js call ', width:400,height:200});});

Easyui Foundation Learning (i)-Basic components