关于bootstrap-table（bootstrap-table-editable）编辑行窗口出不来的问题

Question

关于bootstrap-table（bootstrap-table-editable）编辑行窗口出不来的问题

发布于
2017-10-14

更新于
2017-10-15

前端新手，一开始我在flask下想做一个可以直接编辑行的表格，发现不行。我就写了一个最简单的表格，直接用浏览器打开就行的。弄了一下午了那个窗口始终出不来，换了几个版本的jquery、bootstrap-table-editable等等就是不行，但是发现不同版本的bootstrap-table-editable在控制台显示的错误不一样。
问题是：
一、怎么动态编辑这个最简单的表格？

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">

<link href="https://cdn.bootcss.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/x-editable/1.5.1/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.css">


<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>


<script src="https://cdn.bootcss.com/x-editable/1.5.1/bootstrap3-editable/js/bootstrap-editable.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-table/1.11.1/locale/bootstrap-table-zh-CN.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-table/1.11.1/extensions/editable/bootstrap-table-editable.js"></script>


  </head>

  <body>


  <table id="table"></table>
<script>
  $('#table').bootstrapTable({
    columns: [{
        field: 'id',
        title: 'Item ID',
        editable: true
    }, {
        field: 'name',
        title: 'Item Name'
    }, {
        field: 'price',
        title: 'Item Price'
    }],
    data: [{
        id: 1,
        name: 'Item 1',
        price: '$1'
    }, {
        id: 2,
        name: 'Item 2',
        price: '$2'
    }]
});
</script>
  </body>
</html>

图片描述