后台切图

标签：

JS:

<script src="js/jquery-1.7.1.js" type="text/javascript"></script>
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>

一。

功能描述：点右边的垃圾桶图标，左边的多行输入框内容被清空，，，支持页面中多个这样的功能

HTML:

   <div class="delbox">
          <div class="shmsbox"><textarea name="" class="msk"></textarea></div>
          <div class="delpic" onclick="delwby(this);"><img src="img/del.png" /></div>
          <div class="clear"></div>
   </div>

CSS:

   .delbox{ width:65.5%; height:53px; *height:50px; background-color:#3d66a5; border:solid 1px #cacaca;}
   .delbox .shmsbox{ width:95%; height:53px;*height:50px; float:left; background-color:#fff;}
  .delbox .shmsbox .msk{ width:99%; height:auto; border:0; }
  .delbox .delpic{ width:5%; height:auto; float:left; text-align:center; cursor:pointer;}
  .delbox .delpic img{ width:auto; height:auto; padding-top:16px; margin-left:1px; }

js:

 
    function delwby(obj){
            $(obj).parent().find("textarea",".msk").first().val(‘‘);
  
    }

 注： $(obj).parent().find   对象的父对象 .parent()      在父对象下寻找 .find(‘‘)

二，增加一条功能

HTML:

       <div id="outplan" class="planbox">

              <div>要增加（复制）的内容</div>

              <div>要增加（复制）的内容</div><!--复制内容一-->

       </div>

       <div id="albtn">增加一条</div>

js:

    $(document).ready(function(){

    $("#albtn").click(function(){
      var tabtr="<div>要增加（复制）的内容</div>";
             
　  　$("#outplan").append(tabtr);　　

    });


})

注：被复制内容和要增加的内容要在同一DIV里

$("#outplan").append（“<b>Hello World!</b>”）在元素结尾插入内容
  $("<b>Hello World!</b>").appendTo("#outplan");

$("#outplan").prepend() 方法在被选元素的开头（仍位于内部）插入指定内容。

 $("<b>Hello World!</b>").prependTo("#outplan");

三，点击选中行，弹出窗口，背景变灰

HTML:

                   <tr class="modalLink" onclick="bgs(this);">
                        <td>刘春燕</td>
                        <td>其它</td>
                        <td>2015-01-12 08:02:00</td>
                        <td>2015-01-15 06:10:00</td>
                        <td>初始化</td>
                        <td>未完结</td>
                        <td></td>
                      </tr>
                      <tr class="modalLink" onclick="bgs(this);">
                        <td>刘春燕</td>
                        <td>飞机</td>
                        <td>2015-01-12 08:02:00</td>
                        <td>2015-01-15 06:10:00</td>
                        <td>申核通过</td>
                        <td>完结</td>
                        <td>2015-01-11 08:02:00</td>
                      </tr>

JS:<script type=‘text/javascript‘ src=‘js/jquery.modal.js‘></script>
<script type=‘text/javascript‘ src=‘js/site.js‘></script>

  function bgs(obj){
     //  alert("sdrase");
    
    // $(obj).find("td").attr("style","BACKGROUND-COLOR:#e6e7eb").siblings("tr").find("td").attr("style","BACKGROUND-COLOR:#fff");
    
    // $("#tcbox1").fadeIn(100)
    // $(".overlay").animate({ opacity:.6},10);

$(obj).addClass("trss").siblings("tr").removeClass("trss");
    
  }

后台切图

标签：

原文地址：http://www.cnblogs.com/yanyanmammy/p/4449947.html