jquery AJAX

by busyfmlyman

HTML

<div id="json"></div>

<div id="xml">
    <p>User ID: <input name="userid" size="25" type="text" />

    </p>
    <p>Password: <input name="password" size="25" type="text" />

    </p>
</div>
<button id="json-login">Login</button>
<div id="html"></div>

CSS

#html, #json, #jsonp, #xml, #form {
    border: 1px dashed #ccc;
    margin: 10px 0;
}
#html img {
    width: 50px;
}
#user-login {
    background-color: #fff;
    padding: 4px 7px 2px 7px;
}
#user-avatar {
    float: left;
}
#user-avatar .avatar {
    border: 1px solid #ddd;
    padding: 1px;
    width: 24px;
}
#user-overview {
    margin-left: 36px;
}
#user-overview h1 a {
    font-size: 13px;
    text-decoration: none;
}
#user-overview h1 a:hover {
    text-decoration: underline;
}
#user-overview p {
    color: #666;
    font: italic normal 10px arial, sans-serif;
}
#user-overview p a {
    color: #333;
    text-decoration: none;
}
#user-content {
    background: #fafafa;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fafafa', endColorstr='#efefef');
    background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#efefef));
    background: -moz-linear-gradient(top, #fafafa, #efefef);
    border-top: 1px solid #eee;
}
#octocat {
    background: url(data:image/png;
    base64,...

JavaScript

$(function () {

    var i = 0;
    var fib = (function () {
        var cache = [0, 1];
        return function (n) {
            if (cache[n] === undefined) {
                ;
            }
            return cache[n];
        };
    })();

    $('#json-login').click(function () {

        $.ajax({
            url: '/echo/json/',
            dataType: 'json',
            type: 'POST',
            data: {
                json: JSON.stringify({
                   alert("JSON.stringify alert"); 
                })
            }
        }).done(function (data) {

            $('#json').append(' ' + data.n);

        });

    });


    
});