`
wbfsa
  • 浏览: 5845 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

基于jq的编辑插件singleEdit

阅读更多

前段时间遇到网站整顿,singleEdit主页一直无法打开,现在恢复正常,请大家继续支持!

 

 

  • 目前支持8种编辑方式
  • 身份证,email等31种自带验证模式
  • 验证模式可以自行添加修改
  • ajax无刷新保存数据
  • 数据联动更新
  • 自定义更换皮肤
  • 全部主流浏览器支持
  •  

     

    目前更新至1.0.3版本!

    需要引入的文件

    必需

    • jquery.latestVersion.js(jquery框架最新版本)
    • jquery.singleEdit.js(插件主要文件)
    • lang/singleEdit_zh-cn.js(语言文件包)
    • theme/singleEdit.css(样式文件)

    可选

    • plugins/formValidatorRegex.js(客户端数据验证插件,如果需要执行数据验证功能请引入此插件)
    • plugins/wbfsaTextAreaEncode.js(文本域输入编辑插件,如果需要文本域编辑功能请引入此插件,此插件的功能为转换textarea输入中的/n/r换行符为)
    • calender/WdatePicker.js(日历调用)
    • rater/jquery.rater.js(评分调用)

     



     

     代码:

    $(function() {
     
                $(".example").singleEdit({
                    data: { textbox: "(请点击我)"},//设置编辑对象的值,也可以在对象内直接赋值
                    main: [
                     { id: "textbox", type: "textbox" }//id对应要编辑的对象,type设置编辑方式
                    ]
                });     
             });
    

     

     

     



     

     

    $(function() {
                $(".example").singleEdit({
                    data: { key: "(请点击我)"},//设置编辑对象的值
                    main: [
                     { id: "key", type: "keyboard" }//id对应要编辑的对象,type设置编辑方式
                    ]
                });     
             });
    

     

     

     



     

    $(function() {
                $(".example").singleEdit({
                    selection: [
                    { id: "ch", item: [{ zID: 0, zname: "(请点击我)" }, { zID: 1, zname: "多选框选项1" }, { zID: 2, zname: "多选框选项2" }, { zID: 3, zname: "多选框选项3"}] }//设置选项,id对应main中的id
                    ],
                    data: { ch: 0},//接受一个“0|1|2”类似的字符串
                    main: [
                     { id: "ch", type: "check" }//id对应要编辑的对象,type设置编辑方式
                    ]
                });     
             });
    

     

     

     



     目前支持8种编辑方式。

     

    下载地址:http://plugins.jquery.com/project/SingleEdit

     

    演示:http://www.wbfsaworkstation.com.cn

     

    • 描述: 文本框编辑
    • 大小: 3 KB
    • 描述: 键盘编辑
    • 大小: 11.4 KB
    • 描述: 复选框编辑
    • 大小: 6.3 KB
    • 大小: 29.7 KB
    分享到:
    评论
    14 楼 wbfsa 2009-12-01  
    谢谢大家支持
    13 楼 wbfsa 2009-12-01  
    akunamotata 写道
    很棒的插件,要是再多点功能就好了

    功能还会完善的,内核已经写好了,就等着扩展了~~呵呵
    最终目的是应用于表格的编辑
    12 楼 kaway 2009-12-01  
    貌似效果做得很不错 在前台页面使用会很方便 值得收藏使用
    11 楼 akunamotata 2009-12-01  
    很棒的插件,要是再多点功能就好了
    10 楼 rmn190 2009-12-01  
    多谢楼主分享!
    9 楼 wbfsa 2009-12-01  
    本插件是开源的,用在商业项目上都行。
    8 楼 wbfsa 2009-12-01  
    ruguosmen 写道
    我感觉键盘输入编辑的那个大小写键应该是CAPSLOCK 键吧

    键盘还会加以改进的,今后将支持每个键位自定义显示/隐藏
    7 楼 wbfsa 2009-12-01  
    changyuxin 写道
    复选框有点小问题吧,感觉全选和返选不应该同时可以选中,而且全选后,如果取消某个选项,全选不应该是选中状态,应该是未选中状态,这样感觉全选才对吧!


    朋友很细心啊~~我没有注意到,下个版本会改进
    6 楼 wbfsa 2009-12-01  
    Teok 写道
    挨个试了一下,楼主做的很不错。ui给人感觉很清新简洁。。
    导航栏在ie下有些变形的感觉。

    如果在项目中使用你的这些组件,应该没有什么协议之类的问题吧?


    我还没有在IE6 下测试过。。。 其他浏览器应该没有问题的~~~ 主要是时间不够, 我还在积极改进中
    5 楼 ruguosmen 2009-12-01  
    我感觉键盘输入编辑的那个大小写键应该是CAPSLOCK 键吧
    4 楼 changyuxin 2009-12-01  
    复选框有点小问题吧,感觉全选和返选不应该同时可以选中,而且全选后,如果取消某个选项,全选不应该是选中状态,应该是未选中状态,这样感觉全选才对吧!
    3 楼 Teok 2009-12-01  
    挨个试了一下,楼主做的很不错。ui给人感觉很清新简洁。。
    导航栏在ie下有些变形的感觉。

    如果在项目中使用你的这些组件,应该没有什么协议之类的问题吧?
    2 楼 hongkong 2009-12-01  
    8错!!!!!!!!!
    1 楼 key232323 2009-11-29  
    x下了,写写分享

    相关推荐

      jq 双日历插件

      jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件日历选择器jq 双日历插件...

      jqui插件下载

      Jqui插件是基于jQuery UI库的扩展,用于增强网页的交互性和视觉效果。jQuery UI是一个功能丰富的开源JavaScript库,提供了各种用户界面组件,如拖放功能、对话框、滑块、日期选择器等。本压缩包提供的"jqui插件"可能...

      jq富文本插件编辑器

      【jq富文本插件编辑器】是一款用于...总的来说,这款jq富文本插件编辑器结合jQuery和LayUI,为开发者提供了一种简单易用的方法来实现网页的文本编辑功能,无论是框架还是原生环境,都能轻松集成,提升项目的用户体验。

      基于jq的视频查看插件

      基于jq的视频查看插件,默认全屏播放, 使用时,先加载视频路径( var video_src = getParamFromHref("src") $('.zy_media').append(`视频"}'> ${video_src}" type="video/mp4"> 您的浏览器不支持HTML5视频 ...

      jq图表插件

      "jq图表插件"是一种基于JavaScript库jQuery的可视化图表工具,它使得在网页上创建交互式图表变得简单易行。jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理和动画效果,而jq图表插件则在此基础上...

      分页插件--基于jq编写的分页插件

      本文将详细介绍一个基于jQuery编写的分页插件,以及如何利用这个插件快速实现网页的分页功能。 分页插件的核心目标是提供一种简单、易用的方式来将大量数据分割成多页,允许用户通过点击页码或导航按钮来浏览数据的...

      图片查看 -jq插件

      首先,我们来看“jQueryViewer”这个文件名,这很可能是一个基于jQuery的图片查看器插件。这种插件通常包含JavaScript文件和可能的CSS样式文件,用于增强网页中图片的显示和交互体验。开发者可以轻松地将这些功能...

      基于jq的分页插件,简单易用。代码未压缩

      基于jq的分页插件,简单易用。 $(function () { $("#page").initPage({ maxPage: 5, //最大显示数 pageCount: 7, //总页数 callBack: function (data) { //点击页码回调,data是页码 } }); }); 插件代码未...

      基于JQ插件的把文本内容中表情符号替换为表情图标

      本文将详细探讨一个基于jQuery(JQ)的插件,该插件能够将文本中的表情符号转换为实际的表情图标,从而提供更加生动、直观的用户体验。 首先,我们要理解JQ插件的工作原理。jQuery是一个轻量级的JavaScript库,它...

      jq 弹窗插件

      "jq 弹窗插件"是基于jQuery的一个功能组件,主要用于创建提示框和对话框,使得开发者能够方便地在网页上实现各种交互式弹出窗口。 这个插件的核心特点在于它的高效性和易用性。"一次载入,多次调用"意味着只需在...

      JQ的分页插件

      JQ的分页插件是一种高效的解决方案,它能够帮助开发者轻松实现网页内容的分页显示,提升用户体验。本资源包含了一系列必要的文件,用于演示如何使用这个插件。 首先,我们来看`pagination.css`文件,这是一个CSS...

      JQ jQuery插件如何开发

      本篇文章将详细讲解如何开发一个jQuery插件,以帮助开发者扩展jQuery的功能,提升项目的可维护性和复用性。 首先,让我们理解jQuery插件的基本结构。一个简单的jQuery插件通常由一个函数定义,该函数接收一个jQuery...

      基于jQuery的倒计时插件

      本文将深入探讨基于jQuery的倒计时插件的实现原理、关键代码解析以及如何进行自定义扩展。 ### 一、基础原理 倒计时的核心思想是通过计算当前时间与目标时间之间的差值,并以秒或毫秒为单位进行递减,直至达到零。...

      基于Jq的热力图插件

      本主题关注的是一个基于jQuery和heatmap.js的热力图插件,它提供了一种简便的方式来在网页上集成热力图功能。 jQuery是一款轻量级的JavaScript库,简化了HTML文档遍历、事件处理、动画制作和Ajax交互。它使得...

      最优秀的50个JQ插件

      18. **Draggable & Droppable插件**:实现拖拽功能,适用于布局编辑或文件上传等场景。 19. **Calendar插件**:除了基本的日历功能外,还可以添加事件提醒等高级功能。 20. **Video Player插件**:提供视频播放...

      JQ 插件简单实用步骤条

      "JQ插件简单实用步骤条"是一个利用jQuery来创建的用户界面组件,主要用于指导用户按照一系列步骤完成任务,常见于表单提交、注册流程或者多步骤购物体验等场景。这个插件为开发者提供了一个方便、直观的方式来展示和...

      基于jq+htmlde库存日历插件

      【基于jq+htmlde库存日历插件】是一款在网页应用中用于管理库存时间的交互式日历组件。它结合了jQuery(jq)的高效DOM操作能力和HTML5(htmlde)的新特性,为开发者提供了一个轻量级且功能丰富的解决方案。这款插件...

      JQ第三方分享插件+可自定义链接、标题

      "JQ第三方分享插件+可自定义链接、标题"这个标题揭示了一个基于jQuery的第三方分享工具,它允许开发者方便地在他们的H5页面上实现社交分享功能,并且可以定制分享的链接和标题,以满足不同场景的需求。 jQuery是一...

      基于jquery的日历日程插件

      **基于jQuery的日历日程插件** 在Web开发中,日历日程插件是不可或缺的一部分,它们为用户提供了直观的界面,用于管理任务、安排会议或者查看日期相关的事件。"基于jQuery的日历日程插件"就是这样一个工具,它结合...

      JQ插件第五十六:17种翻页插件

      "JQ插件第五十六:17种翻页插件"是一个专门解决这个问题的jQuery插件,它提供了丰富的翻页解决方案,适应多种不同的应用场景。 这个插件的核心在于它的灵活性和易用性。只需要提供记录总数、URL以及是否使用AJAX...

    Global site tag (gtag.js) - Google Analytics