Some Useful JavaScript & jQuery Snippets – Part 2

Check if cookies are enabled $(document).ready(function() { var dt = new Date(); dt.setSeconds(dt.getSeconds() + 60); document.cookie = “cookietest=1; expires=” + dt.toGMTString(); var cookiesEnabled = document.cookie.indexOf(“cookietest=”) != -1; if(!cookiesEnabled){ //cookies are […]

  • Check if cookies are enabled
  • $(document).ready(function() {
        var dt = new Date();
        dt.setSeconds(dt.getSeconds() + 60);
        document.cookie = "cookietest=1; expires=" + dt.toGMTString();
        var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1;
        if(!cookiesEnabled){
            //cookies are not enabled
        }
    });
  • Toggle all checkboxes
  • var tog = false; // or true if they are checked on load
    $('a').click(function() {
        $("input[type=checkbox]").attr("checked",!tog);
        tog = !tog;
    });
  • Get the index of an element
  • $("ul > li").click(function () {
        var index = $(this).prevAll().length;
    });
  • Validate date of birth
  • $("#lda-form").submit(function(){
        var day = $("#day").val();
        var month = $("#month").val();
        var year = $("#year").val();
        var age = 18;
        var mydate = new Date();
        mydate.setFullYear(year, month-1, day);
    
        var currdate = new Date();
        currdate.setFullYear(currdate.getFullYear() - age);
        if ((currdate - mydate) < 0){
            alert("Sorry, only persons over the age of " + age + " may enter this site");
            return false;
        }
        return true;
    });
  • Test if an element is visible
  • if($(element).is(":visible")) {
        //The element is Visible
    }
  • Counting child elements
  • <div id="foo">
    <div id="bar"></div>
    <div id="baz">
    <div id="biz">
    </div>
    <span><span>
    </div>
    
    //jQuery code to count child elements
    $("#foo > div").length
  • Center an element on the screen
  • jQuery.fn.center = function () {
        this.css("position","absolute");
        this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
        this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
        return this;
    }
    
    //Use the above function as:
    $(element).center();
  • Moving options from list A to list B
  • $().ready(function() {
        $('#add').click(function() {
            !$('#select1 option:selected').appendTo('#select2');
        });
        $('#remove').click(function() {
            !$('#select2 option:selected').appendTo('#select1');
        });
    });
  • Select all checkboxes
  • $(document).ready(function(){
        $("#checkboxall").change(function(){
            var checked_status = this.checked;
            $("input[name=checkall]").attr("checked", checked_status);
        });
    
    });
  • Get the current URL
  • $(document).ready(function() {
        var pathname = window.location.pathname;
    });
  • Check if and which key was pressed
  • $(function() {
        $(document).keypress(function(e){
            switch(e.which){
            // "ENTER"
            case 13:
            alert('enter pressed');
            break;
    
            // "s"
            case 115:
            alert('s pressed');
            break;
    
            (...)
    
            }
        });
    
    });

    Message from TestkingWe are among the best ccie service provider to help you better prepare for ccna exam. Sign up for online prep course to successfully pass ccie wireless certification.

    Tagged with:

    cody

    Cody loves jQuery - he puts the magic into every web application. He is crazy about Curry dishes.

    Stay up to date with the latest web design and development news and relevant updates from Codrops.