zoukankan      html  css  js  c++  java
  • 【特效】复选框分行控制文本框

    也是实际项目中遇到的一个小小效果,意义不大,就是复习了一下if表达式中,复选框被选中了怎么写。

    html:

    <table class="box">

             <tr>

                 <td><input type="checkbox" class="check_1"></td>

            <td><input type="text" class="text_1" disabled></td>

        </tr>

        <tr>

                 <td><input type="checkbox" class="check_1"></td>

            <td><input type="text" class="text_1" disabled></td>

        </tr>

        <tr>

                 <td><input type="checkbox" class="check_1"></td>

            <td><input type="text" class="text_1" disabled></td>

        </tr>

    </table>

    css:

    table{ 800px; margin:100px 0 0 100px; border-collapse:collapse;}

    .box td{ height:60px; border:1px solid #ccc; padding:0 20px;}

    .text_1{ 300px; padding:0 10px; height:35px; border:1px solid #ccc; background:#fff;}

    js:

    <script>

    $(document).ready(function(){

             var check=$(".check_1");

             var text=$(".text_1");

             check.each(function(){

                       $(this).click(function(){

                                if(this.checked){

                                         $(this).parents("tr").find(".text_1").attr("disabled",false).css("border","1px solid #000");

                                         }

                                else{

                                         $(this).parents("tr").find(".text_1").attr("disabled",true).css("border","1px solid #ccc");

                                         }

                                });

                       });

    });

    </script>

    效果预览:http://www.gbtags.com/gb/rtreplayerpreview-standalone/2917.htm

    源码下载:http://pan.baidu.com/s/1eSz7Dzs

  • 相关阅读:
    傻帽
    csc编译c#文件
    真空
    继承,多态及抽象性
    HASH算法
    正则表达式
    js向数组和map添加元素
    详解TypeScript项目中的tsconfig.json配置
    TS:元素隐式具有 “any“ 类型,因为类型为 “any“ 的表达式不能用于索引类型
    yarn基本命令
  • 原文地址:https://www.cnblogs.com/xiaoxianweb/p/5704177.html
Copyright © 2011-2022 走看看