2013-01-14 14 views
13

मैं एक छोटा जावास्क्रिप्ट एप्लिकेशन लिख रहा हूं जो मुझे छवियों को असंकालिक रूप से अपलोड करने की अनुमति देता है।क्या फॉर्मडाटा ऑब्जेक्ट इंटरनेट एक्सप्लोरर 10 में उपलब्ध है?

यह स्क्रिप्ट हर ब्राउज़र में भयानक काम करता है के लिए, लगता है जो, इंटरनेट एक्सप्लोरर को छोड़कर ...

तो पहली बात यह है कि मैं बनाया jQuery के लिए AjaxForm प्लगइन है, जो काम करता है के साथ IE9- संस्करणों के लिए फ़ॉलबैक बनाने के लिए है महान!

यहां जेएस लिपि है।

$("#Uploader").change(function(e){ 
     var form = $("#UploaderForm"); 
     form.trigger('submit'); 
     $(this).attr('disabled','disabled'); 
     e.preventDefault(); 
}); 
$("#UploaderForm").submit(function(e){ 
     e.preventDefault(); 
     e.stopPropagation(); 
     var type="POST";var loading=$("#PhotoIsLoading"); 
     if(windowApi === true){ 
      var formData = new FormData($(this)[0]); 
      $.ajax({ 
       url: url, 
       type: type, 
       xhr: function() { 
        myXhr = $.ajaxSettings.xhr(); 
        if(myXhr.upload){ myXhr.upload.addEventListener('progress',progressHandlingFunction, false);} 
        return myXhr; 
       }, 
       beforeSend: function(){loading.removeClass('isHidden_important');}, 
       success: function(response){ 
        jres = JSON.parse(response); 
        alert("Test ok, file uploaded"); 
       }, 
       error: function(response){console.warn(response);}, 
       data: formData, 
       cache: false, 
       contentType: false, 
       processData: false 
      }); 
      e.preventDefault(); 
     }else{ 
      $(this).ajaxSubmit({ 
       url: url, 
       dataType: 'json', 
       type: type, 
       beforeSubmit: function(){loading.removeClass('isHidden_important');$(this).formSerialize();}, 
       success:function(response){ 
        jres = JSON.parse(response); 
        alert("FallbackTest Complete"); 
       }, 
       error: function(response){console.warn(response);}, 
      }); 
      e.preventDefault(); 
      return false; 
     } 
    }); 

WindowApi और हर दूसरे चर एक वैश्विक लिपि में परिभाषित कर रहे हैं, लेकिन चिंता मत करो, वे काम करते हैं। सटीक होना, WindowApi यह है:

var windowApi=true; 
if(window.File&&window.FileReader&&window.FileList&&window.Blob){ 
console.log("window.api ready");windowApi=true;} 
else{console.log("window.api not ready");windowApi=false;}; 

तो, कोड की लाइनों के इस समूह के साथ मैं हर ब्राउज़र और IE9- ब्राउज़रों ... संभाल

समस्या अब IE10 साथ है, क्योंकि यह सब मिल गया है window.* विधियों और यह FormData ऑब्जेक्ट का उपयोग कर सकते हैं। लेकिन जब मैं आईई 10 और फॉर्मडाटा के साथ कुछ अपलोड करने का प्रयास करता हूं तो मुझे फॉर्मडाटा ऑब्जेक्ट के लिए "एक्सेस अस्वीकृत" त्रुटि प्राप्त होती है।

एचटीएमएल जाता है कि इस प्रक्रिया में शामिल है:

<form name="UploaderForm" id="UploaderForm" method="post" enctype="multipart/form-data"> 
    <input type="file" name="Uploader" id="Uploader" accept="image/*" tabindex="1" /> 
</form> 

तो अंत में मेरे सवाल है:

मैं एक "प्रवेश निषेध" कैसे हो रही बच सकते हैं IE10 में अपवाद है जब तक पहुंचने का प्रयास फॉर्मडाटा ऑब्जेक्ट?

उत्तर

7

https://stackoverflow.com/a/13657047/641293 और https://stackoverflow.com/a/4335390/641293 उपयोगी हो सकता है। आईई <input type='file'> प्रोग्रामेटिक रूप से आप क्या कर सकते हैं इसके बारे में काफी सख्त है।

पहले के आधार पर, इस ठीक चीजों को पहली पंक्ति बदल रहा है?

$("#Uploader").on('click', function(e){ /* rest of the function unchanged... */ 
+0

यह समाधान IE10 लिए एकदम सही है लेकिन मैं अभी भी IE9- के साथ कुछ मुद्दों है, लेकिन मैं मैं लगता है:

वैसे, आप File API के साथ संयोजन में FormData की उपलब्धता की जांच करने से बेहतर हो सकता है "फॉर्मडाटा ओबीजे" –

1

आपको एक पहुँच जब आप एक प्रपत्र फ़ील्ड्स कि जावास्क्रिप्ट द्वारा के साथ गड़बड़ कर दिया है है कि प्रस्तुत इनकार किया मिलता है। आपने अपने अपलोडफील्ड पर disabled विशेषता गतिशील रूप से जोड़ा है, यही कारण है कि आपको Access denied प्राप्त होता है। शायद आपको इसे change ईवेंट पर फ़ील्ड को अक्षम किए बिना शॉट देना चाहिए?

var formDataSupport = false; 
if (typeof FormData === 'function' && 
    window.File && 
    window.FileReader && 
    window.FileList && 
    window.Blob) 
{ 
    console.log("File API available, formData available"); 
    formDataSupport = true; 
} 
+0

के बजाय यह एक और समाधान ढूंढना है, यह पिछले नियंत्रण के लिए ठीक है लेकिन मुझे आईई 10 में त्रुटि को रोकने के लिए कुछ चाहिए @ एलेक्स ने सही समाधान लिखा है। वें भी वैसे भी +1 –

संबंधित मुद्दे