【项目成长日记】如何使用EasyUI-demo创建自己的项目

【前言】


       7月伊始的时候,我们的米总给我们研发团队下达了新的指令。 “9月份之前,要把我们的ITOO5.1搞出来!”我和我的小伙伴们都有点慌了,毕竟我们的ITOO是个百万数量级访问多模块的大应用 。2个月的时间也不算很充裕。而我们的小队更是负责一个全新的模块开发,连需求文档都有自己搞。所以,为了节省开发时间,我们决定使用Easy-UI来作为我们的界面主体。

【正文】


       
        那我美丽的小羊妹妹可能会问了:“那凯哥哥,什么是Easy-UI呀?”


       小凯同学:“这你可就问对人了,我昨天才用EasyUI实现了一个Demo呢。UI呢,就是User Interface的意思,中文就是用户界面,EasyUI呢从名字就能看出来,它是帮助开发人员轻松实现界面设计的。它是一组基于JQuery的UI插件集合。通俗点说,就是别人做好的功能界面给你源码你来用。“

       “听起来可能有点复杂,我们来看看怎么用吧!”


        “嗯嗯,是的呢!”

        
        “首先我们要登录EasyUI的官方网站。”

    



       
      “看到那个‘查看EasyUI demo’按钮了吗?”


          “看到了呢!”
         
        
        “单击它就好了”
        “然后我们以表单为例来看怎么使用它。





“可是凯哥哥,我粘贴上以后为什么是这个样子呀?好丑呀!”






 
   “你呀! 还是那么心急。我还没说完呢,你就急着上手了。下面才是重点。你看!”





“这些引用我们都还没有呢!”




“那这些引用要从哪里找呀!”




“这里”







“下载好这个包以后,解压,复制,粘贴到我们的项目里”




“建一个文件夹,贴进来就好了”

“然后再更改一下引用地址就好了!”



“凯哥哥,我改好了,可是还不行”








“格式,顺序都是要一样的 。像这样~”



“看!”


“真是太棒了!,我也会用Easy-UI了。


【结尾】

        笨笨的小羊妹妹都学会用EasyUI了,那聪明的你呢?赶快动手尝试吧。

特别鸣谢:感谢美丽的周丽同同学不厌其烦的帮助。附上博客链接以表敬意。


  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 78
    评论
以下是一个使用 EasyUI 的 `numberbox` 组件的 `onchange` 事件的示例: ```html <!DOCTYPE html> <html> <head> <title>EasyUI NumberBox onchange Event Demo</title> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/jquery-easyui@1.9.21/themes/bootstrap/easyui.css"> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-easyui@1.9.21/jquery.easyui.min.js"></script> </head> <body> <input id="numberbox" class="easyui-numberbox" style="width: 200px;"> <script type="text/javascript"> $(function() { $('#numberbox').numberbox({ onChange: function(newValue, oldValue) { console.log('新值:' + newValue); console.log('旧值:' + oldValue); // 其他处理... } }); }); </script> </body> </html> ``` 在上面的示例中,我们引入了 EasyUI 的样式和脚本文件。然后,我们创建了一个 `numberbox` 输入框,并设置了宽度为 200 像素。 在 JavaScript 部分,我们使用了 `$()` 函数来初始化 `numberbox` 组件,并通过 `onChange` 属性定义了回调函数。当输入框的值发生变化时,回调函数会被触发,并将新值和旧值作为参数传递给回调函数。在示例中,我们简单地将新值和旧值打印到控制台上,你可以根据需要进行其他的处理操作。 你可以将以上代码保存为一个 HTML 文件,并在浏览器中打开该文件,即可看到 `numberbox` 输入框,并在控制台中查看值变化时的输出。
评论 78
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

码农胖虎-java

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值