如何使用jquery解码返回的json对象？

Question

我想为jQuery使用上传插件。 http://valums.com/ajax-upload/

当我设置返回响应类型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> 

Answer 1

这个jQuery插件可以很方便地转换为从JSON：http://code.google.com/p/jquery-json/

此外，你可能会在你所引用的博客文章感兴趣的this comment：

对不起，垃圾邮件的博客文章（这是伟大的），但我想我会提到，我发现问题：

无论出于何种原因，响应总是有<pre>标签在响应类型为plain/text的整个响应周围。这导致eval()调用失败。我目前的解决方案只是在eval()调用之前剥离这些标签，现在一切正常。不是一个很好的解决方案，但至少我现在可以继续工作。

Answer 2

这可能是因为我对该插件一无所知，但您可能需要看看您在服务器端设置的响应类型;你应该设置HTTP响应为“text/plain”，“text/javascript”或“application/javascript”之类的内容/ MIME类型 - 看看能否解决你的问题。

Answer 3

http://api.jquery.com/jQuery.parseJSON/

var obj = jQuery.parseJSON('{"name":"John"}'); 
alert(obj.name === "John"); 

Answer 4

我一直在寻找的同一个脚本的解决方案，并偶然发现了这个页面。我没有找到一个解决方案的在线所以这里是我如何固定它：

@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);

呢..