zoukankan      html  css  js  c++  java
  • jquery DOM模型添加 删除

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>文档标题</title>
      <script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
      <script>
      
        function add(t){
         
          $(t).parent().parent().append($(t).parent().clone());
        }
        function del(t){
          if($(".select").length>1){
                $(t).parent().remove();
            }
        }
        function getSelect(){
          //还未写好
            $("select").each(function(t){
              console.dir($(t));
            });
           
        }
      </script>
      <style>
       
      </style>
    </head>
    <body>
    
      <div>
        <button onclick="getSelect()">
        获取下拉框的值
      </button>
      </div>
     
      <table>
        <thead>
        	<tr>
          	<td>序号</td>
           <td>公司名称</td>
          </tr>
        </thead>
        <tbody>
        	<tr>
          	<td>1</td>
           <td>
             <div class='select'>
                <select>
                  <option value ="volvo">Volvo</option>
                  <option value ="saab" >Saab</option>
                  <option value="opel" selected>Opel</option>
                  <option value="audi">Audi</option>
                  </select>
                <button onclick="del(this)">
                  删除当前行
                </button>
              	  <button onclick="add(this)">
                  添加行
                </button>
              </div>
           </td>
          </tr>
        </tbody>
      </table>
      
    </body>
    </html>
    

      

  • 相关阅读:
    审判程序的灵魂
    程序的灵魂-算法
    JQuery
    JavaScript
    BOM和DOM
    HTML和css
    css属性
    初始HTML
    单表查询和连表查询
    事务和python操作数据库
  • 原文地址:https://www.cnblogs.com/guozhe/p/14707989.html
Copyright © 2011-2022 走看看