複数の画像投稿機能完成

初めてjQueryを1から考えて使いました。railsチュートリアルの時はrubyやrailsのフレームワークでは無いのでスルーしていました。ここにソースコードを貼りたいのですがブログの仕様上動画とソースコード（マークダウン )を両立をさせる事ができないようです。いちよコードは貼っておきますがシンタックスハイライトにならないのは醜くて辛いですね。しかもペーストするとコードが全部左寄りになってしまう仕様....

とりあえず思うように動かすことを最優先にしたので文法やら規則やら言語使用やら丸々わかっていないので明日にもjsとjqueryについて軽く概要を把握しておこうと思います。あとは投稿した画像をサーバーから削除する機能を追加すれば画像まわりは完成です。

<script type="text/javascript">
$('#micropost_picture').bind('change', function() {
var size_in_megabytes = this.files[0].size/1024/1024;
if (size_in_megabytes > 5) {
alert('ファイルサイズは5MB jpeg,gif,pngの拡張子のみです');
}
});

var number_files = 3;
var input_append = '<input multiple="multiple" accept="image/jpeg,image/gif,image/png" type="file" name="micropost[pictures][]" id="micropost_pictures" />';

function htmlElementLength(element) {
return $(String(element)).children().length;
}

$("#appendButton").click(function(){
if (htmlElementLength('.picture_field') <= number_files) {
$('.picture_field').append(input_append);
if (htmlElementLength('.picture_field') == number_files) {
$('#appendButton').fadeOut();
}
}
});

$("#remove_file").click(function(){
var picture_filed_length = htmlElementLength('.picture_field');
for (var i=0; i<picture_filed_length; i++){
$('#micropost_pictures').remove();
}
$('#appendButton').fadeIn();
});

</script>