入门客AI创业平台(我带你入门,你带我飞行)
博文笔记

jEditable jQuery技术使用

创建时间:2006-12-12 投稿人: 浏览次数:2239

 jEditable技术是现在比较流行的AJAX技术,jEditable 通过jQuery,借助Editable,实现页面编辑特效.具体使用办法如下:

1,在视图上(页面),前提是有jquery.js,jeditable.js两个JS文件,代码如下:

<script src="lib/jquery.js" type="text/javascript"></script>
<script src="lib/jeditable.js" type="text/javascript"></script>

下载路径:http://www.appelsiini.net/~tuupola/javascript/jEditable/

<h1 class="editable" id="header_1">Header 1</h1>
<h2 class="editable" id="header_2">Header 2</h2>
<h3 class="editable" id="header_3">Header 3</h3>
<p class="editable_textarea" id="paragraph_1">

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis

</p>
<div class="editable_textarea" id="div_1">

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis

</div>

2,其页面JAVASCRIPT脚本如下:

$(document).ready(function() {
    $(".editable").editable(url, {
        indicator : "正在处理中"
    });
    $(".editable_textarea").editable(url, {
        indicator : "正在处理中",
        type : "textarea",
       event :"dblclick",
       id:"elementid",
       name:"elementvalue"
    });
});

其中name,id可作为页面传到业务层参数

声明:该文观点仅代表作者本人,入门客AI创业平台信息发布平台仅提供信息存储空间服务,如有疑问请联系rumenke@qq.com。