jQuery插件——x-editable表单字段实时编辑)——getstart

2. 参见官方文档：x-editable 官网

3. 引入js、css文件
   

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<link href="bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet">
<script src="bootstrap-editable/js/bootstrap-editable.js"></script>

1. 写一个a标签

<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>

1. jquery.document(){//......}

$('#username').editable({    
        type: 'text',    // type of input (text, textarea, select, etc)
        title: 'Enter username',  //
        name:  'username',  //name of field (column in db)    
        pk:    1 ,           //primary key (record id)    
        value: 'superuser!',  //initial value. Usefull for select, where value is integer key of text to be shown. If empty - will be taken from element html contents
        url:'/post',    // url to server-side script to process submitted value (/post, post.php etc)
        success: function(response, newValue) {        
            userModel.set('username', newValue); //update backbone model    
         }
   });

4.也是可以改变请求的方式:post/get

    Default request method is POST, you can change it via defaults config:

$.fn.editable.defaults.ajaxOptions = {type: "PUT"};

5.JSON response:
    If your server returns JSON, you can always send HTTP status 200 with error flag in response body.
    To process it use success handler:

//assume server response: 200 Ok {status: 'error', msg: 'field cannot be empty!'} 
$('#username').editable({    
        ...    
        success: function(response, newValue) {        
            if(response.status == 'error') 
                    return response.msg; //msg will be shown in editable form   
             }
    });