2012-03-19 14 views
19

我正在調試這個ajax很長一段時間了。我有這個在我的jQuery的文件:json_encode不能使用html字符串作爲值

$("#typeForm").ajaxForm({ 
    success : function(html){ 
     alert(html); 
}).submit(); 

這就要求service.php,並在其中我有這樣的:

$data = array('upload_data' => $this->upload->data()); 
$str = "<div style='position:relative'><img src='/assets/ui/success.png' /><span style='position:relative;top:-15px;'>Nachricht empfangen!</span></div>"; 
echo json_encode(array('file_name' => $data['upload_data']['file_name'], 'prompt' => $str)); 

這是行不通的。但通過將$str替換爲$str = "HELLO WORLD";,jQuery會發出警告我應該做什麼。什麼似乎是問題?

編輯:

下面是輸出的的screenie:

enter image description here

它確實警報,但如果我修改我的jQuery成這樣:

$("#typeForm").ajaxForm({ 
    success : function(html){ 
     var obj = $.parseJSON(html); 
     alert(obj); 
}).submit(); 

隨後,它甚至沒有任何警報。

我做了的var_dump在json_encode,這裏是轉儲,它看起來像一個畸形的JSON:

string(214) "{"file_name":"cde595988d386529909ce5a8fe3a6d6f.png","prompt":"<div style="position:relative;"><img src="\/assets\/ui\/success.png" \=""><span style="position:relative;top:-15px;">Nachricht empfangen!&lt;\/span&gt;&lt;\/div&gt;"}" 
</span></div> 

這裏是service.php的全部內容

class Service extends CI_Controller 
{ 
    public function __construct() 
    { 
     parent::__construct(); 
    } 
    public function index() 
    { 
     $filename = 'uploadfile'; 

     $config['upload_path'] = './uploads/temp'; 
     $config['allowed_types'] = 'jpg|png|gif|doc|docx|pdf|ppt|pptx|xls|xlsx|bmp'; 
     $config['max_size'] = '3072'; 
     $config['encrypt_name'] = TRUE; 
     $config['remove_spaces'] = TRUE; 

     $this->load->library('upload', $config); 

     if (!$this->upload->do_upload($filename)) 
     { 
      $error = array('error' => $this->upload->display_errors()); 
        echo json_encode(array('error' => $error['error'])); 
     } 
     else 
     { 
      $data = array('upload_data' => $this->upload->data()); 
      $file_name = $data['upload_data']['file_name']; 
      //print_r($data); 
      //echo json_encode(array('test' => "Hello World")); 
      $str = "<div style='position:relative;'><img src='/assets/ui/success.png' /><span style='position:relative;top:-15px;'>Nachricht empfangen!</span></div>"; 
      $str2 = json_encode(array("file_name" => $file_name, "prompt" => $str)); 
      //var_dump($str2); 
      exit(json_encode(array('file_name' => $data['upload_data']['file_name'], 'prompt' => $str))); 
     } 
    } 
} 
+0

您的JSON的樣子.. 。? – 2012-03-19 03:21:32

+0

作者:「不會工作」你的意思是這是拋出錯誤?或者它不注入HTML或..? – 2012-03-19 03:22:22

+0

它不起作用? JSON並不在乎你在字符串中嵌入的內容 - 它可以是數字,也可以是文本,也可以是html。無關緊要,只要JSON語法規則得到遵守。 – 2012-03-19 03:22:25

回答

0

它看起來像你需要逃避引號服務器端。由於他們在那裏,它似乎正在創建一個無效的JSON字符串。

+0

正是我所懷疑的,但我似乎無法找到什麼是正確的轉義,我應該在'$ str' – 2012-03-19 03:30:50

+0

如果你想手動轉義這個,你可以改成這個 $ str =「

Nachricht empfangen!
」; – davehale23 2012-03-19 14:42:34

3

一些東西去嘗試:

給ajaxForm支持的dataType的說法,如果你期望一個JSON來自服務器,使用dataType: json像這樣

$("#typeForm").ajaxForm({ 
    success : function(html){ 
     // html here is already automatically a json object 
     alert(html.prompt); 
    }, 
    dataType: 'json' 
}).submit(); 

你可以張貼滿service.php? OR嘗試以下方法:

出口(json_encode(陣列( 'FILE_NAME'=> $數據[ 'upload_data'] [ 'FILE_NAME'], '提示'=> $ STR)));

- 編輯 -

不知道爲什麼json_encode回報這種怪異的字符串:S,是json_encode一個標準的PHP庫或外部庫?我問這是因爲某些服務器沒有json_encode在PHP時......我測試了我的本地和使用PHP內部json_encode,它工作正常:

<?php 
$str = "<div style='position:relative'><img src='/assets/ui/success.png' /><span style='position:relative;top:-15px;'>Nachricht empfangen!</span></div>"; 
echo json_encode(array('prompt' => $str)); 

// output 
//{"prompt":"<div style='position:relative'><img src='\/assets\/ui\/success.png' \/><span style='position:relative;top:-15px;'>Nachricht empfangen!<\/span><\/div>"} 
+0

感謝這一點,但沒有它不起作用。如果我這樣做了,那麼它根本不會提醒。 – 2012-03-19 03:36:14

+0

你有這個測試頁嗎?更容易,如果我可以通過和直接測試 – 2012-03-19 03:37:50

+0

和是的,它不會提示dataType JSON會期望一個有效的JSON字符串,在這種情況下,「HELLO WORLD」不是有效的JSON – 2012-03-19 03:38:20

0
string(214) "{"file_name":"cde595988d386529909ce5a8fe3a6d6f.png","prompt":"<div style="position:relative;"><img src="\/assets\/ui\/success.png" \=""><span style="position:relative;top:-15px;">Nachricht empfangen!&lt;\/span&gt;&lt;\/div&gt;"}" 
</span></div> 

這似乎被打破因爲沒有報價轉義。當找到一個未轉義的「時,它會打破你期望的JSON結構。 轉義的」應該是\「,單引號與\」等等。

0

如果你不能找到這更好的解決方案,您可以編碼值以base64編碼:

$data = array('upload_data' => $this->upload->data()); 
$str = base64_encode("<div style='position:relative'><img src='/assets/ui/success.png' /><span style='position:relative;top:-15px;'>Nachricht empfangen!</span></div>"); 
echo json_encode(array('file_name' => $data['upload_data']['file_name'], 'prompt' => $str)); 

,並在客戶端對其進行解碼,IMO這是更安全,這也是如果你更適用處理來自不同語言的字符。

ALSO:

,以確保沒有其他字符將在JSON字符串調用退出加入;您打印後請寫作

+0

這種有點工作,但你會如何解碼它在jQuery? – 2012-03-19 05:12:54

+0

對於鉻或mozilla你可以使用atob()或btoa() – jerjer 2012-03-19 05:15:49

+0

對於其他瀏覽器,你可以使用這個js庫http://ntt.cc/2008/01/19/base64-encoder-decoder-with-javascript.html或這個http://stackoverflow.com/questions/246801/how-can-you-encode-to-base64-using-javascript – jerjer 2012-03-19 05:16:43

66

我今天的json_encode有同樣的問題。但在測試了很多後,我找到了正確的解決方案:

PHP: json_encode(ARRAY, JSON_HEX_QUOT | JSON_HEX_TAG); 

在JavaScript中相同的解碼:

在PHP中的數組或字符串編碼

JS: var d = $.parseJSON(content); 
+3

令人驚歎的答案!這是做到這一點的方法。 – 2013-09-19 18:31:26

+0

我遇到了同樣的問題,但我幾乎接近解決方案。我正在使用'json_encode($ json,JSON_HEX_QUOT | JSON_HEX_APOS)'。將'JSON_HEX_APOS'更改爲'JSON_HEX_TAG'使我的問題消失了! – RedYetiCo 2014-03-08 03:46:43

+2

這應該被標記爲正確的答案。 – Robert 2015-12-09 02:54:40

相關問題