2013-08-28 75 views
3

设置HTML我有以下范围:jQuery的通过AJAX

<span class='username'> </span> 

来填充这个我为此我使用Ajax获得从PHP的值:

$('.username').html(getUsername()); 
    function getUsername(){ 
    $.ajax({ 
     type: 'POST', 
     url: myBaseUrl + 'Profiles/ajax_getUsername', 
     dataType: 'json', 
     data: { 

     }, 
     success: function(data){ 
      document.write(data); 
     } 
    }) 
} 

现在,当我调试我见返回的数据(data)是正确的值,但span标记之间的html保持不变。

我到底做错了什么?

小更新

我曾尝试以下:

function getUsername(){ 
    $.ajax({ 
     type: 'POST', 
     url: myBaseUrl + 'Profiles/ajax_getUsername', 
     dataType: 'json', 
     data: { 

     }, 
     success: function(data){ 
      $('.username').html('RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRr'); 
     } 
    }) 
} 

getUsername(); 

仍有标签之间没有HTML(无文本),但是当我看到控制台完成的方法,具有已执行。

答案的小更新

错误是在我的Ajax功能我忘了打印的实际响应!感谢您对所有的答案的,对于那些你们谁正在寻找这个问题,这里是我的Ajax功能:

public function ajax_getUsername(){ 
    if ($this->RequestHandler->isAjax()) 
    { 
     $this->autoLayout = false; 
     $this->autoRender = false; 
     $this->layout = 'ajax'; 
    } 
    print json_encode($this->currentClient['username']); 

} 

请注意,我使用CakePHP这就是为什么有一些的buildin方法。总而言之,只记得print json_encode($this->currentClient['username']);

+0

你想进去跨度的数据? – Shadow

+0

在初始页面加载之后,您绝对不应该使用document.write。 – epascarello

+0

你是否尝试直接写入'span'? –

回答

8

你的代码的逻辑流程是不完全正确的。一个异步函数不能返回任何东西,因为在收到响应时执行将移到下一个语句。相反,响应中所需的所有处理都必须在success处理程序中完成。试试这个:

function getUsername() { 
    $.ajax({ 
     type: 'POST', 
     url: myBaseUrl + 'Profiles/ajax_getUsername', 
     dataType: 'json', 
     data: { }, 
     success: function(data){ 
      $('.username').html(data); // update the HTML here 
     } 
    }) 
} 

getUsername(); 
+1

数据是“JSON”,所以可能必须在'html()'部分做一些不同的事情。 – epascarello

+0

@epascarello也是如此,但我会留下,直到OP指定它作为一项要求。 –

+0

@RoryMcCrossan ive更新了我的文章 –

1

替换此

success: function(data){ 
    $('.username').text(data); 
} 
1

在成功的方法,你应该使用这样的事情:

$(".username").text(data); 
1

你应该设置HTML回调

function getUsername() { 
    $.ajax({ 
     type: 'POST', 
     url: myBaseUrl + 'Profiles/ajax_getUsername', 
     dataType: 'json', 
     data: { 

     }, 
     success: function(data){ 
      $('.username').html(data); 
     } 
    }) 
} 
+0

什么也没有发生:甚至尝试过$('。username')。html('hello world')但没有结果 –

+0

@MarcRasmussen因为你需要先执行那个函数或者把这个代码放到一个没有函数的地方。 – jcubic

1

添加一个有趣的返回声明ction getUsername

 var result = ""; 
     $('.username').html(getUsername()); 
     function getUsername(){ 
     $.ajax({ 
      type: 'POST', 
      url: myBaseUrl + 'Profiles/ajax_getUsername', 
      dataType: 'json', 
      data: { 

      }, 
      success: function(data){ 
       document.write(data); 
       result = data; 
      } 
     }) 
      return result; 
    } 
+3

由于请求是异步的,因此这不起作用。什么都不会返回。 –

1

您可以使用.load()
API文档:http://api.jquery.com/load/
你的情况:

$('.username').load(myBaseUrl + 'Profiles/ajax_getUsername', 
        {param1: value1, param2: value2});