form.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <title>画像をリサイズしてPOST</title>
    </head>
    <body>
            <form id="postform" action="upload.php" method="post" enctype="multipart/form-data">
                <div>
                    <label for="title">画像タイトル</label>
                    <input type="text" name="title" id="title" />
                </div>
                <div>
                    <label>画像ファイル</label>
                    <input type="file" name="imgfile" id="imgfile" accept="image/*" onChange="resizeImg();" />
                </div>
                <div>
                    <canvas id="imgcanvas" width="0" height="0">HTML5対応ブラウザをご使用ください</canvas>
                </div>
                <div>
                    <input type="submit" value="画像を送信">
                </div>

            </form>
            <script type="text/javascript" src="upload.js"></script>
            <script type="text/javascript" src="resize.js"></script>
    </body>
</html>