<div id="file">
        <apex:inputFile value="{!attachment.body}" filename="{!attachment.name}" id="file" title="Upload Attachment" styleclass="fileType"/>
    </div>

<label>Select file: <input type="file" name="imagefile" accept="image/jpeg, image/png">
 </label>
 <input type="submit" value="upload">

'value="{!attachment.body}" filename="{!attachment.name}"'

<input id="file-input" type="file" name="file"/>
<input type="button" value="Upload" onclick="uploadFile();"/>

<script type="text/javascript">
    var __sfdcSessionId = '{!GETSESSIONID()}';
</script>
<script src="/soap/ajax/29.0/connection.js" type="text/javascript"></script>

function uploadFile()
{
    var input = document.getElementById('file-input');
    var parentId = // Your ID here, I suggest using a merge field to get this

    var filesToUpload = input.files;

    for(var i = 0, f; f = filesToUpload[i]; i++)
    {
        var reader = new FileReader();

        // Keep a reference to the File in the FileReader so it can be accessed in callbacks
        reader.file = f;

        reader.onerror = function(e)
        {
            switch(e.target.error.code)
            {
                case e.target.error.NOT_FOUND_ERR:
                    alert('File Not Found!');
                    break;
                case e.target.error.NOT_READABLE_ERR:
                    alert('File is not readable');
                    break;
                case e.target.error.ABORT_ERR:
                    break; // noop
                default:
                    alert('An error occurred reading this file.');
            };
        };

        reader.onabort = function(e)
        {
            alert('File read cancelled');
        };

        reader.onload = function(e)
        {
            var att = new sforce.SObject("Attachment");
            att.Name = this.file.name;
            att.ContentType = this.file.type;
            att.ParentId = parentId;

            att.Body = (new sforce.Base64Binary(e.target.result)).toString();

            sforce.connection.create([att],
            {
                onSuccess : function(result, source)
                {
                    if (result[0].getBoolean("success"))
                    {
                        console.log("new attachment created with id " + result[0].id);
                    }
                    else
                    {
                        console.log("failed to create attachment " + result[0]);
                    }
                },
                onFailure : function(error, source)
                {
                    console.log("An error has occurred " + error);
                }
            });
        };

        reader.readAsBinaryString(f);
    }
}

<label>Select file: <input type="file" name="imagefile" accept="image/jpeg, image/png">
 </label>
 <input type="submit" value="upload">