TypeError in jQuery: cannot call method toUpperCase of undefined

TypeError in jQuery: cannot call method toUpperCase of undefined

My ajax calls worked fine until recently. Now I'm getting a TypeError on undefined in jQuery and can't figure out what went wrong. It started when I put all javascript in a separate file. I tried going back to inline script, but nothing seems to help.

 
Uncaught TypeError: Cannot call method 'toUpperCase' of undefined
jquery-1.7.1.js:7482

  1. s.type = s.type.toUpperCase();
Any ideas on how I managed to mess things up?
 
Here's the complete html that's sent to the browser:
  1. <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />
        <title>Game on!</title>
        <link href="/Content/site.css" rel="stylesheet"/>
        <script src="/Scripts/modernizr-2.5.3.js"></script>
    </head>
    <body>
        <section class="featured">
            <div class="content-wrapper">
                <canvas id="surface" width="800" height="600" style="border: 2px solid red; background: white"></canvas>
            </div>
            <script type="text/javascript">
                window.onload = function () {
                    $.ajax(
                        {
                            url: "api/login?username=r1&password=r1",
                            type: "GET",
                            dataType: "json",
                            success: function (data, type, xhr) {
                                alert("Success!");
                            }
                        }
                    );
                };
            </script>
        </section>
        <script src="/Scripts/jquery-1.7.1.js"></script>
    </body>
    </html>