如何使用 jQuery EasyUI Mobile 设计手机按钮？

EasyUI 是一个 HTML5 框架，用于使用基于 jQuery、React、Angular 和 Vue 技术的用户界面组件。它有助于为交互式 Web 和移动应用程序构建功能，为开发人员节省大量时间。

在本文中，我们将学习为移动应用程序的用户界面设计各种按钮样式。

EasyUI for jQuery 下载：

 https://www.jeasyui.com/download/index.php

在实现您的代码时，请注意正确的文件路径。

示例 1：以下代码演示了用于某些用户界面目的的基本登录类型按钮。

html

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    


    
        
            
                Login
            
        
        
            
        
        
            
                
            
            
                
            
            
                
                
                 Login
                
            
            
                
                
                 Register
                 
            
        
    

输出：

示例 2：以下代码显示了要包含在移动设备用户界面应用程序中的一些彩色按钮。

html

     
    
    
    
     
    
    
     
    
     
    
    
    
    
    
    
    
    
    
    
    


    
          
        
              
              
        Buttons with colors
              
        Green
        Grey
        Pink
        light-blue
        Red
        Blue
  
        
    
    

输出：

示例 3：以下代码演示了水平或垂直位于一行中的一组按钮。

html

      
    
     
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
        p{
            line-height:150%;
        }
          
    


    
        
            
                
                  EasyUI Button Groups
                
            
        
        
        
            
                HTML 
                CSS 
                PHP 
            
        
        
            
                  
             HTML stands for HyperText Markup Language. 
                It is used to design web pages using a markup
                language. HTML is the combination of Hypertext
                and Markup language. Hypertext defines the link 
                between the web pages. A markup language is used 
                to define the text document within tag which defines 
                the structure of web pages..
             
  
            
            
                  
             Cascading Style Sheets, fondly referred to as CSS, 
                is a simply designed language intended to simplify 
                the process of making web pages presentable.
                CSS allows you to apply styles to web pages.
                More importantly, CSS enables you to do this 
                independent of the HTML that makes up each web page.
             
  
            
            
                  
             The term PHP is an acronym for PHP: Hypertext
                Preprocessor. PHP is a server-side scripting language 
                designed specifically for web development. PHP can be 
                easily embedded in HTML files and HTML codes can also 
                be written in a PHP file.
             
  
            
        
    
  
    
        function display(id){
            $('div.m-item').hide();
            $(id).show();
        }
    
      
    

输出：

示例 4：以下代码演示了用于 Internet 连接的“开/关”等开关按钮。

html

      
    
    
     
    
    
     
    
     
    
    
    
    
    
    
    
    
    
    
    


      
    
        
            
                
                  Switch Button Settings
                
            
        
        
            
                Connections
                
                
            
            
                Bluetooth
                
                
            
            
                Mobile Data
                
                
                
            
              
            
                More...
            
        
    
    

输出：