zoukankan      html  css  js  c++  java
  • 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
    	})
    });
    

      

  • 相关阅读:
    机器不学习:如何处理数据中的「类别不平衡」?
    机器不学习:一种提升预测能力的方法-机器学习模型
    机器不学习:CNN 入门讲解1-什么是卷积
    机器不学习:浅析深度学习在实体识别和关系抽取中的应用
    机器不学习:用神经模块网络学习推理
    机器不学习:初识迁移学习
    机器不学习:一文彻底读懂智能对话系统
    跟随鼠标的div
    回到顶部的流畅滚动——scrollTop
    js学习小笔记
  • 原文地址:https://www.cnblogs.com/yongyuandishen/p/14155570.html
Copyright © 2011-2022 走看看