• bootstrap 模态框 模板 代码


    <!-- 添加员工的模态框 start -->
    <div class="modal fade" id="empAddModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
            <h4 class="modal-title" id="myModalLabel">员工添加</h4>
          </div>
          <div class="modal-body">
          	<!-- 员工添加表单start -->
          	<form class="form-horizontal">
    	    	<div class="form-group">
    				<label for="empName_add_input" class="col-sm-2 control-label">empName</label>
    		    	<div class="col-sm-10">
    		    		<input type="text" class="form-control" name="empName" id="empName_add_input" placeholder="empName">
    				</div>
    			</div>
    			  <div class="form-group">
    				<label for="email_add_input" class="col-sm-2 control-label">email</label>
    			    <div class="col-sm-10">
    			      <input type="email" class="form-control" name="email" id="email_add_input" placeholder="email">
    			    </div>
    			  </div>
    			 <div class="form-group">
    		    	<label class="col-sm-2 control-label">性别</label>
    		      	<div class="radio col-sm-10">
    		      		<label><input type="radio" name="gender" id="gender_add_input1" value="M" checked="checked">男</label>
    		        	<label><input type="radio" name="gender" id="gender_add_input2" value="F">女</label>
    		      	</div>
    			 </div>
    			 <div class="form-group">
    				<label for="deptName_add_input" class="col-sm-2 control-label">deptName</label>
    		    	<div class="col-sm-10">
    		    		<select class="form-control" id="deptName_add_input" name="deptId">
    		    			<option value="">测试部</option>
    		    			<option value="">研发部</option>
    		    		</select>
    				</div>
    			</div>
    		</form>
           	<!-- 员工添加表单end -->
          </div><!-- .modal-body结束 -->
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            <button type="button" class="btn btn-primary">保存</button>
          </div>
        </div>
      </div>
    </div><!-- 添加员工的模态框 end -->
    

      激活方式:

    $("#emp_add_modal_btn").click(function(){
    	$('#empAddModal').modal({
    		backdrop:false
    	})
    });
    

      

  • 相关阅读:
    JSBinding+SharpKit / MonoBehaviour替换成JSComponent原理
    JSBinding + SharpKit / JavaScript 加载流程
    JSBinding + SharpKit / 常见问题
    JSBinding + SharpKit / Coroutine支持
    Mysql 自定义HASH索引带来的巨大性能提升----[真相篇]
    Mysql 自定义HASH索引带来的巨大性能提升----[挖坑篇]
    python实现冒泡排序
    python 实现二分法查找
    Mysql 存储过程+定时任务,完成分区自动维护
    innodb insert buffer 插入缓冲区的理解
  • 原文地址:https://www.cnblogs.com/yongyuandishen/p/14155570.html
Copyright © 2020-2023  润新知