Jquery通過ajax設置HTML

Question

我有以下范圍：

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

為了填充這個我必須從PHP得到一個值因此我使用Ajax：

    $('.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，這就是為什么有一些構建方法。 總而言之，只記得print json_encode($this->currentClient['username']);

Answer 1

您的代碼的邏輯流程不太正確。 異步函數不能返回任何內容，因為在收到響應時執行將移動到下一個語句。 相反，響應所需的所有處理必須在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();

Answer 2

替換為此

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

Answer 3

在成功方法中你應該使用這樣的東西：

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

Answer 4

你應該在回調中設置html

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

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

Answer 5

為函數getUsername添加一個return語句

       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;
    }

Answer 6

你可以使用.load（）
Api文檔： http ： //api.jquery.com/load/
在你的情況下：

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