bootstrap 模态框modal 传值问题

后台管理的项目常会使用到bootstrap里面的模态框modal，因此编辑的时候就需要将页面上的值传到模态框里面并显示，如：

html代码：

<table class="table_tab" id="voinceTable">
      <tr> 
          <th><input type="checkbox" class="checkAll"></th>
          <th>编号</th><th>发票类型</th><th>发票开头</th><th>发票明细</th>
          <th>纳税人识别号</th><th>营业电话</th><th>营业地址</th><th>银行</th>
          <th>开户地区</th><th>开户支行</th><th>银行账号</th>
          <th>操作</th>
      </tr>
      <tr>
          <td><input type="checkbox" class="checkSelect"></td>
           <td>1</td><td>xxxxx</td><td>啦啦</td><td>11</td>
           <td>22</td><td>33</td><td>44</td><td>55</td>
           <td>66</td><td>77</td><td>88</td>
           <td><a class="green_btn" data-toggle="modal" data-target="#editVoince" data-id="edit">编辑</a>
               <a class="red_btn">删除</a>
           </td>
      </tr>
</table>

<!-- model start -->
<form action="saveSupplier" method="POST">
<div class="modal fade" id="editVoince" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
       <div class="modal-content">
          <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
              <h4 class="modal-title">新增发票信息</h4>
          </div>
          <div class="modal-body">
             <div class="planel_boxs">
                 <div class="row"> 
                     <div class="row_line col-md-6 col-sm-6 col-xs-12">
                         <label>发票明细：</label>
                         <input type="text" class="form-controls content">
                     </div>
                     <div class="row_line col-md-6 col-sm-6 col-xs-12">
                         <label>纳税人识别号：</label>
                         <input type="text" class="form-controls identify">
                     </div>
                </div>  
            </div>
        </div>
        <div class="modal-footer text-center">    
           <input type="submit" class="btn btn-default btn_blue" value="保存">
           <button type="button" class="btn btn-default btn_red" data-dismiss="modal">取消</button>
        </div>
      </div>
   </div>
</div>
</form>
<!-- model end -->

js代码如下：

$('#editVoince').on('show.bs.modal', function (event) {
      var btnThis = $(event.relatedTarget); //触发事件的按钮
      var modal = $(this);  //当前模态框
      var modalId = btnThis.data('id');   //解析出data-id的内容
      var content = btnThis.closest('tr').find('td').eq(2).text();
      modal.find('.content').val(content);         
});

保存数据时，可以异步请求提交数据或直接form表单提交数据就行了。

界面如图：