基於bootstrap的bootstrap-editable插件實現即時編輯功能


   1.引用基本css和js:
<link href="bootstrap3/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><!--bootstrapcss-->
<link href="js/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet" type="text/css" /><!--bootstrap3-editable 插件樣式--> <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script> <script src="jss/bootstrap.min.js" type="text/javascript"></script> <script src="js/bootstrap3-editable/js/bootstrap-editable.min.js" type="text/javascript"></script><!--bootstrap3-editable 插件js-->

 
2.html和js
<a href="javascript:;" id="username" data-pk="2257"> 中國語言文字網</a> </div>
    <script type="text/javascript">
        $(function() {
            //editables 
            $('#username').editable({
                url: 'files/Handler.ashx',
                type: 'text',
                pk: $("#username").attr('data-pk'),//唯一標示值
                name: 'username',
                title: '修改',
                success: function(value) {
                    $("#username").text(value);
                }
            });



        });

    </script>

3.在files/Handler.ashx里處理程序。修改標題。
 
        

 更多參數使用。大家可以百度。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM