2009-05-02 61 views
1

我想爲jQuery使用上傳插件。 http://valums.com/ajax-upload/如何使用jquery解碼返回的json對象?

當我設置返回響應類型JSON,Firefox會彈出一個對話框,詢問我怎麼樣來處理返回的JSON對象。

人們在上傳腳本的作者頁面上提出了同樣的問題,但目前爲止還沒有答案。希望在這裏的JavaScript人可以找出我們如何處理這個問題。

謝謝。

<script type= "text/javascript"> 
     /*<![CDATA[*/ 
     $(document).ready(function(){ 

      /* example 1 */ 
      var button = $('#button1'), interval; 
      new AjaxUpload(button, { 
       //action: 'upload-test.php', // I disabled uploads in this example for security reasons 
       action: '/posts/upload_images/', 
       name: 'myfile', 
       responseType: 'json', 
       onSubmit : function(file, ext){ 
        // change button text, when user selects file   
        button.text('Uploading'); 

        // If you want to allow uploading only 1 file at time, 
        // you can disable upload button 
        this.disable(); 

        // Uploding -> Uploading. -> Uploading... 
        interval = window.setInterval(function(){ 
         var text = button.text(); 
         if (text.length < 13){ 
          button.text(text + '.');      
         } else { 
          button.text('Uploading');    
         } 
        }, 200); 
       }, 
       onComplete: function(file, response){ 
        var json = response; 
        alert(json); 
        button.text('Upload'); 

        window.clearInterval(interval); 

        // enable upload button 
        this.enable(); 

        // add file to the list 
//     $('<li></li>').appendTo('#example1 .files').text(json.response_text);      
        $('<li></li>').appendTo('#example1 .files').text(file);      
       } 
      }); 
     }); 
    /*]]>*/ 
</script> 

回答

1

這個jQuery插件可以很方便地轉換爲從JSON:http://code.google.com/p/jquery-json/

此外,你可能會在你所引用的博客文章感興趣的this comment

對不起,垃圾郵件的博客文章(這是偉大的),但我想我會提到,我發現問題:

無論出於何種原因,響應總是有<pre>標籤在響應類型爲plain/text的整個響應周圍。這導致eval()調用失敗。我目前的解決方案只是在eval()調用之前剝離這些標籤,現在一切正常。不是一個很好的解決方案,但至少我現在可以繼續工作。

+1

我不能從經驗中發言,但希望他使用該插件還不需要其他的插件解碼JSON。 – 2009-05-02 17:42:39

0

這可能是因爲我對該插件一無所知,但您可能需要看看您在服務器端設置的響應類型;你應該設置HTTP響應爲「text/plain」,「text/javascript」或「application/javascript」之類的內容/ MIME類型 - 看看能否解決你的問題。

+0

我的回覆類型是「application/json」。我有另一個ajax測試應用程序,從窗體發送文本,並使用json返回後端響應,然後前端正常提示。所以我不認爲我在處理數據和發回json的後端有問題。該測試應用程序只使用jquery的jquery.post。 – ViX 2009-05-03 00:05:16

0

我一直在尋找的同一個腳本的解決方案,並偶然發現了這個頁面。我沒有找到一個解決方案的在線所以這裏是我如何固定它:

@upload-file.php: 更換

echo "success".$cc; 

echo json_encode(array(
status' => 'success', 
'id' => $picid, 
'image' => $imgurl 
)); 

@front end: 更換

var bb=response.substr(0,7) 
var idd=response.replace('success',' '); 
var idb =idd.replace(/^\s*|\s*$/g,''); 
if(bb==="success") 
{ 
    $('<span></span>').appendTo('#files').html('<img src="images/'+file+'" alt="" width="120" height="120" style="margin:5px;" />').addClass('success'); 
} 
else 
{ 
    $('<span></span>').appendTo('#files').text(file).addClass('error'); 
} 

var what = jQuery.parseJSON(response); 
if(what.status == 'success') 
{ 
    $('<span id='+what.id+'></span>').appendTo('#files').html('<img src="'+what.image+'" alt="" width="120" height="120" style="margin:5px;" /><br><a href="javascript:void(0)" onClick="deleteFile('+what.id+');">Delete</a>').addClass('success'); 
} 
else 
{ 
    $('<span></span>').appendTo('#files').text(response).addClass('error'); 
} 

並實際回答這個問題。

jQuery.parseJSON(response);

呢..