[原创]jQuery插件Realtime-Modifier正式发布！

请注意: 该插件将于2012-05-01删除

删除原因:

　　该插件无存在的意义. 有不需要插件的解决方案.

解决方案:

　　当鼠标滑过Input的时候, 增加边框样式; 当鼠标划出时, 删掉边框样式.

代码:

$("input").hover(function(){
　　// Add border here.
　　$(this).css("border", "1px silver solid");
}, function() {
　　// Remove border here
　　$(this).cs("border", "1px transparent solid");
});　

　　

---

以下内容已经无效

---

软件名称：

Realtime-Modifier

开发背景：

　　Realtime-Modifier是一款“所见即所得”的“实时文本更新”jQuery插件。现在网站开发讲究的是“人性化”，“提高用户体验”等，对此，我们也不例外。正巧这次公司做的项目用到了类似功能，于是我便针对该功能进行开发，制作了这样的一款jQuery插件。

功能描述：

　　点击文字后文字将变为文本框，可以在里面输入内容。输入完毕后按回车提交，或按ESC回滚。（类似于QQ个性签名）

　　支持浏览器：

• IE 6.0 +
• Chrome 1.0 +（All Version）
• Safari 3.0 +
• Firefox 2.0 +
• Opera 9.0 +

　　其他软件基础：

　　　　jQuery 1.5 +

官网地址：

　　http://code.google.com/p/realtime-modifier/

Demos：

效果展示：

• 当鼠标划过文字时，文字会变为斜体，以提示用户该文本可修改。点击即可修改该文本。

  

• 点击文本后，将会变为输入框形式，可以键入所需内容。按“Enter”键提交，按“ESC”键回滚。

  

• 文本已经修改完成，根据需要也可使用AJAX提交到服务器。

  

源代码：

// On load.
$(document).ready(function() {

    // For each element.
    $(".text").each(function(i) {

        // Call the modify method.
        $(this).modify({
            hoverClass: "hoverClass",    // Not required.
            inputClass: "inputClass",    // Not required.
            submitMethod: function() {   // Not required.
                alert($(this).text());   // Alert the value.
            }
        });
    });
});

 

※如果需要其他内容帮助，可以访问项目的网站，那里将会有更多的信息供您获取。

※如果您对本插件有任何的疑问，可以移步此处进行留言，我们会尽快给您回复。