Safari javascript 動かない mac

現在、それぞれのブラウザで動作チェックを行なっているのですが、safariだけjsが反応しないので質問させていただきました。safariで動作するためにはどうしたら良いのでしょうか？

view

<div class="images-field clearfix"> <%= f.label :image %> <%= f.file_field :images, multiple: true, class: "file-input" %> <% if @item.images.attached? %> <% @item.images.each do |image| %> <div class="image-box"> <%= image_tag image.variant(resize: '100x100'), class:"item_images" %> <p> <%= image.filename %> </p> <%= f.hidden_field :images , name: "item[images][]", value: "#{image.blob.id}", style: "display: none;", class: "item-images-input" %> <%= link_to "Edit", "", class: "btn-edit" %> <%= file_field "edit-image","" , class: "edit-image-file-input file-input", style: "display: none;"%> <%= link_to "Delete", "", class: "btn-delete" %> </div> <% end %> <% end %> </div>

js

$(document).on('click', function() { $('#item_images').on('change',function(e){ var files = e.target.files; var d = (new $.Deferred()).resolve(); $.each(files,function(i,file){ d = d.then(function() { return Uploader.upload(file)}) .then(function(data){ return previewImage(file, data.image_id); }); }); $('#item_images').val(''); }); $('.images-field').on('click','.btn-edit', function(e){ e.preventDefault(); $(this).parent().find('.edit-image-file-input').trigger("click"); }); $('.images-field').on('change','.edit-image-file-input', function(e){ var file = e.target.files[0]; var image_box = $(this).parent(); Uploader.upload(file).done(function(data){ replaceImage(file, data.image_id, image_box); }); }); $('.images-field').on('click','.btn-delete', function(e){ e.preventDefault(); $(this).parent().remove(); }); var replaceImage = function(imageFile, image_id, element){ var reader = new FileReader(); var img = element.find('img'); var input = element.find('.item-images-input'); var filename = element.find('p'); reader.onload = function(e){ input.attr({value: image_id}); filename.html(imageFile.name); img.attr("src", e.target.result); }; reader.readAsDataURL(imageFile); } var previewImage = function(imageFile, image_id){ var reader = new FileReader(); var img = new Image(); var def =$.Deferred(); reader.onload = function(e){ var image_box = $('<div>',{class: 'image-box'}); image_box.append(img); image_box.append($('<p>').html(imageFile.name)); image_box.append($('<input>').attr({ name: "item[images][]", value: image_id, style: "display: none;", type: "hidden", class: "item-images-input"})); image_box.append('<a href="" class= "btn-edit">Edit</a>'); image_box.append($('<input>').attr({ name: "edit-image[]", style: "display: none;", type: "file", class: "edit-image-file-input file-input"})); image_box.append('<a href="" class="btn-delete">Delete</a>'); $('.images-field').append(image_box); img.src = e.target.result; def.resolve(); }; reader.readAsDataURL(imageFile); return def.promise(); } var Uploader = { upload: function(imageFile){ var def =$.Deferred(); var formData = new FormData(); formData.append('image', imageFile); $.ajax({ type: "POST", url: '/items/upload_image', data: formData, dataType: 'json', processData: false, contentType: false, success: def.resolve }) return def.promise(); } } })

以下のような質問にはリアクションをつけましょう

• 質問内容が明確
• 自分も答えを知りたい
• 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

• 間違っている
• 質問になっていない投稿
• スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。