`
qinya06
  • 浏览: 582257 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jquery 插件 demo

 
阅读更多
例子主要编写一个输入框,页面加载时会显示初始值,无边框,看起来像span,点击时,边框会出现,而且内容会被选中,失焦时会触发ajax事件,修改内容的值。

jQuery.fn.inputText = function(value, action, viladata)
  {
      var $input = this;
      //设置输入框初始值
      if(value != "")
      {
      $input.val(value);
      }
      //设置输入框为无边框
     $input.attr("style","border:0px solid #fff");
     //输入框被点击
     $input.click(function(){
     //显示边框
     $input.attr("style","border:1px solid #aaa");
     //选中内容
     $input.select();
     });
     
     //输入框失焦
    $input.blur(function(){
         $input.attr("style","border:0px solid #fff");
         
         //验证函数,验证是否通过
         if(viladata)
         {
         var input = $input.val();
         $.post(action,{value:input},function(data){
             if(data=="success")
             {
             alert("修改成功");
             window.location.reload();
             }
            else alert("修改失败");
        },"TEXT");
         }
     });
 }


在HTML中调用为:

 <input type="text" id="input"/>
 <script type="text/javascript">
$(document).ready(function(){
    $("#input").inputText("初始值","a.jsp",validata);
});

//验证函数
function validata()
{
    return true;

}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics