岁月已逝，记忆尚存。用键盘记录记忆，留住记忆~

  • jQuery 实现form的全选

    2011-07-29

    代码如下：

    <html>
    <head>
    <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
    <script type=”text/javascript” src=”jquery-1.4.3.min.js“></script>
    <script type=”text/javascript”>
    function checkAll    (objChkAll){
     var frm = jQuery(objChkAll).parents().filter(“form,:first”);
     if(frm != null){
      jQuery(frm).find(“:checkbox”).attr(“checked”,objChkAll.checked);
     }
    }
    </script>
    </head>
    <body>
    <form action=”" method=”post”>
    <input type=”checkbox” name=”checkbox” id=”checkbox” onclick=”checkAll(this);” />全选
    <input type=”checkbox” name=”checkbox” id=”checkbox” />1
    <input type=”checkbox” name=”checkbox” id=”checkbox” />2
    <input type=”checkbox” name=”checkbox” id=”checkbox” />3
    <input type=”checkbox” name=”checkbox” id=”checkbox” />4
    <input type=”checkbox” name=”checkbox” id=”checkbox” />5
    </form>
    </body>
    </html>

    保存下，备用。

    其他方法，利用JS实现全选：js 实现 checkbox 的全选

    作者：Weber Mj | 分类目录：jQuery | 标签：
    2 条评论

  • jQuery 简单示例

    2011-07-29

    示例代码：

    <html>
    <head>
    <script type=”text/javascript” src=”jquery-1.4.3.min.js”></script>
    <script type=”text/javascript”>
    $(document).ready(function(){
     $(“#clickArea”).click(function(){
      $(“#demoInfo”).hide(1000); //隐藏ID为 demoInfo
      $(this).css(“background-color”,”red”); //改变当前元素的颜色
      //$(this).hide(); //隐藏自身
     });

     $(“#showInfo”).click(function(){
      $(“#demoInfo”).show(1000); //显示指定层的内容 show(speed,callback) 可选值 speed 显示隐藏的速度 callback 当前函数执行完成之后执行的函数
     });

     $(“#showHide”).click(function(){
      $(“#showHideDemoInfo”).toggle(1000);
     })

    });
    </script>
    </head>
    <body>
    <div id=”clickArea” style=”height:30px; line-height:30px; border:1px #ff0000 solid;”>点我，隐藏下面的内容。</div>
    <button id=”showInfo” type=”button”>显示</button>
    <div id=”demoInfo” style=”height:25px; border:1px #ff0000 solid; margin:10px;”>这里的内容是显示的</div>
    <hr>
    <h1>显示/隐藏的 切换</h1>
    <button id=”showHide” type=”button”>显/隐</button>
    <div id=”showHideDemoInfo” style=”border:1px #ff0000 solid; height:25px; padding:5px;”>这里的内容是做测试用的</div>
    </body>
    </html>

    代码如上。

    相关信息：jQuery CSS选择器

    作者：Weber Mj | 分类目录：jQuery | 标签：
    没有评论

  • 解决jQuery中$定义与其他JS文件冲突的问题

    2011-07-29

    jQuery 名称冲突

    jQuery 使用 $ 符号作为 jQuery 的简介方式。

    某些其他 JavaScript 库中的函数（比如 Prototype）同样使用 $ 符号。

    jQuery 使用名为 noConflict() 的方法来解决该问题。

    var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。

    实例代码：

    <html>
    <head>
    <script type=”text/javascript” src=”/jquery/jquery.js”></script>
    <script type=”text/javascript”>
    var jq=jQuery.noConflict();
    jq(document).ready(function(){
      jq(“button”).click(function(){
        jq(“p”).hide();
      });
    });
    </script>
    </head>

    <body>
    <h2>This is a heading</h2>
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <button type=”button”>Click me</button>
    </body>
    </html>

    定义jq代替$。

    相关文档：

    ecshop的jquery,jqzoom,transport.js冲突 问题解决(麻烦版)

    作者：Weber Mj | 分类目录：jQuery | 标签：
    没有评论

  • jQuery CSS选择器

    2011-07-29
    语法 描述
    $(this) 当前HTML元素
    $("p") 所有<p>元素
    $("p.intro") 所有class="intro"的<p>元素
    $(".intro") 所有class="intro"的元素
    $("#intro") id="intro"的第一个元素
    $("ul li:first") 每个<ul>的第一个<li>元素
    $("[href]") 所有带有href的元素属性
    $("[href='#']") 所有带有href 并且值等于"#"的元素
    $("[href!='#']") 所有带有href 并且值不等于"#"的元素
    $("[href$='.jpg']") 所有带有href 并且值以".jpg"结尾的元素属性
    $("div#intro .head") id="intro"的<div>元素中的所有class="head"的元素
    作者：Weber Mj | 分类目录：jQuery | 标签：
    没有评论