[bootsrap]模态框使用例

<a href="#modal1" role="button" class="btn btn-primary btn-sm" data-toggle="modal">合同添加</a><div id="modal1" class="modal hide fade">                 <div class="modal-header">                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>                  <h3>合同添加界面</h3>                </div>                <div class="modal-body">                  <form class="form-horizontal" id="form1">               {% csrf_token %}                  <div class="control-group">                    <label class="control-label">合同编码:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill1" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9">                     <span class="text-error">限数字,字母</span>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">合同名称:</label>                    <div class="controls"><textarea rows="8" class="form-control" id="bill2"></textarea></div>                  </div>                  <div class="control-group">                    <label class="control-label">是否续签:</label>                    <div class="controls">                      <select class="form-control input-mini" placeholder=".input-mini" id="bill3">                <option>是</option>                <option>否</option>               </select>              </div>                  </div>                  <div class="control-group">                    <label class="control-label">原合同编码:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill4" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9">                     <span class="text-error">限数字,字母</span>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">合同类型:</label>                    <div class="controls">                      <select class="form-control input-small" placeholder=".input-small" id="bill5">                <option>光纤</option>                <option>交叉</option>                <option>团购</option>               </select>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">合帐缴费号码:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill6" onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">                     <span class="text-error">限数字</span>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">缴费合帐号:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill7" onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">                     <span class="text-error">限数字</span>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">座机数量:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill8" onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">座机费用:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill9" onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">备注一:</label>                    <div class="controls"><input type="text" class="form-control" id="bill10"></div>                  </div>                  <div class="control-group">                    <label class="control-label">光纤一:</label>                    <div class="controls"><input type="text" class="form-control" id="bill11"></div>                  </div>                  <div class="control-group">                    <label class="control-label">纤一费用:</label>                    <div class="controls"><input type="text" class="form-control" id="bill12"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注二:</label>                    <div class="controls"><input type="text" class="form-control" id="bill13"></div>                  </div>                  <div class="control-group">                    <label class="control-label">光纤二:</label>                    <div class="controls"><input type="text" class="form-control" id="bill14"></div>                  </div>                  <div class="control-group">                    <label class="control-label">光纤二费用:</label>                    <div class="controls"><input type="text" class="form-control" id="bill15"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注三:</label>                    <div class="controls"><input type="text" class="form-control" id="bill16"></div>                  </div>                  <div class="control-group">                    <label class="control-label">手机数量:</label>                    <div class="controls"><input type="text" class="form-control" id="bill17"></div>                  </div>                  <div class="control-group">                    <label class="control-label">手机费用:</label>                    <div class="controls"><input type="text" class="form-control" id="bill18"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注四:</label>                    <div class="controls"><input type="text" class="form-control" id="bill19"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他数量一:</label>                    <div class="controls"><input type="text" class="form-control" id="bill20"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他费用一:</label>                    <div class="controls"><input type="text" class="form-control" id="bill21"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注五:</label>                    <div class="controls"><input type="text" class="form-control" id="bill22"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他数量二:</label>                    <div class="controls"><input type="text" class="form-control" id="bill23"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他费用二:</label>                    <div class="controls"><input type="text" class="form-control" id="bill24"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注六:</label>                    <div class="controls"><input type="text" class="form-control" id="bill25"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他数量三:</label>                    <div class="controls"><input type="text" class="form-control" id="bill26"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他费用三:</label>                    <div class="controls"><input type="text" class="form-control" id="bill27"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注七:</label>                    <div class="controls"><input type="text" class="form-control" id="bill28"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他数量四:</label>                    <div class="controls"><input type="text" class="form-control" id="bill29"></div>                  </div>                  <div class="control-group">                    <label class="control-label">其他费用四:</label>                    <div class="controls"><input type="text" class="form-control" id="bill30"></div>                  </div>                  <div class="control-group">                    <label class="control-label">备注八:</label>                    <div class="controls"><input type="text" class="form-control" id="bill31"></div>                  </div>                  <div class="control-group">                    <label class="control-label">优惠前费用:</label>                    <div class="controls"><input type="text" class="form-control" id="bill32"></div>                  </div>                  <div class="control-group">                    <label class="control-label">优惠后费用:</label>                    <div class="controls"><input type="text" class="form-control" id="bill33"></div>                  </div>                  <div class="control-group">                    <label class="control-label">费用处理方式:</label>                    <div class="controls">                      <select class="form-control input-small" placeholder=".input-small" id="bill34">                <option>合帐</option>                <option>分摊</option>                <option>手工</option>               </select>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">合同年限:</label>                    <div class="controls"><input type="text" class="form-control" id="bill35"><span></span></div>                  </div>                  <div class="control-group">                    <label class="control-label">合同生效时间:</label>                    <div class="controls"><input type="text" class="form-control" id="bill36"><span class="text-error">格式:20160101</span></div>                  </div>                  <div class="control-group">                    <label class="control-label">合同失效时间:</label>                    <div class="controls"><input type="text" class="form-control" id="bill37"><span class="text-error">格式:20160101</span></div>                  </div>                  <div class="control-group">                    <label class="control-label">合同签订日期:</label>                    <div class="controls"><input type="text" class="form-control" id="bill38"><span class="text-error">格式:20160101</span></div>                  </div>                  <div class="control-group">                    <label class="control-label">经办人:</label>                    <div class="controls">                      <input type="text" class="form-control" id="bill39" onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9">                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">出费类型:</label>                    <div class="controls">                      <select class="form-control input-small" placeholder=".input-small" id="bill40">                <option>固定收费</option>                <option>按时收费</option>               </select>                    </div>                  </div>                  <div class="control-group">                    <label class="control-label">佣金发放:</label>                    <div class="controls"><input type="text" class="form-control" id="bill41"></div>                  </div>                  <div class="control-group"><div class="controls"><button id="bill_add" type="button" class="btn btn-primary btn-sm">提交</button></div></div>                  </form>                                    </div>               </div>

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com

原标题：[bootsrap]模态框使用例

关键词：