无法在html页面上显示响应数据

时间:2015-07-05 12:38:37

标签: javascript ajax dom

我从ajax查询获得了响应数据,我可以在console.log函数中看到它。但现在我想显示存储在对象中的用户名。

display.html

$(document).ready(function() {
    LoadUserScript(ReadUser);
});

devlope.js

function LoadUserScript(callback){
    function LoadUser(){
        $.getScript('js/user.js', callback);
    }
    if (!$.fn.user){
        LoadUser();
    }
    else {
        if (callback && typeof(callback) === "function") {
            callback();
        }
    }
}

function ReadUser(){
    var readUser = new users.user;
    readUser.ReadUserDetail("gourav", "pwd");
    readUser.PrintUserDetail(); //This is Printing the 
}

user.js的

(function (){
    "use strict";
    var root = this;
    var users;
    if (typeof exports !== 'undefined') {
        users = exports;
    } else {
        users = root.users = {};
    }

    var user = users.user = function () {
        this.ap = [];
        this.tg = [];
        this.userdetails = [];
    };

    var user = users.user = function (username, userpassword) {
        this.username = username;
        this.name = "";
        this.userpassword= userpassword;
        this.ap = [];
        this.tg = [];
        this.userdetails = [];
        this.url = "http://localhost/RestApi/ReadUser";
    };

    user.prototype.fillUserDetail = function ( response, handle) {
        var obj = JSON.parse(response);
        handle.name = obj.name;
        handle.username = obj.login;
        if(obj.AccountDetail)
        {
            handle.userdetails = obj.AccountDetail;
        }
        if(obj.ap)
        {
            handle.ap = obj.ap;
        }
        if(obj.tg)
        {
            handle.tg = obj.tg;
        }
    };

    user.prototype.PrintUserDetail = function(){
        console.log(this.username);
        console.log(this.name);
        console.log(this.userdetails);
        console.log(this.ap);
    };

    user.prototype.ReadUserDetail = function (username, userpassword)
    {
        this.username = username;
        this.userpassword = userpassword;
        var sentdata = {"login":this.username, "pwd":this.userpassword};
        var callback = this.fillUserDetail;
        var localhandle = this;
        $.ajax({
            type: "POST",
            url: this.url,
            data: JSON.stringify(sentdata),
            contentType: "application/json",
            success: function(response){
                callback(response, localhandle);
            },
            error: function (xhr, thrownError) {
                alert(thrownError);
            },
            async: false
        });
    };
}).call(this);

现在,当我从 devlope.js 调用ReadUser()时,我得到的所有对象值都正确,这意味着readUser变量中的所有数据都是正确的。 现在在display.html中我想显示我从响应中获得的字段名称并存储在字段readUser.name中。

<div class="col-style">
    <div class="sparkboard" id="sparkboard-1"></div>
    <div class="sparkboard-info">
        <i class="fa fa-smile-o" >Hello <readUser.name> ???
        </i>
    </div>
</div>

但我不确定我应该如何访问Hello in旁边的readUser.name

2 个答案:

答案 0 :(得分:0)

一种方法是在HTML中使用span元素:

<i class="fa fa-smile-o" >
    <span id="readusername"></span>
</i>

访问&amp;从变量中填入JS:

document.querySelector('#readusername').textContent = readUser.name;

答案 1 :(得分:0)

把这个

#include <stdio.h>
#include <stdlib.h>
#include <limits.h>
#include <ctype.h>

typedef int Type;

typedef struct vector {
    size_t size;
    size_t capacity;
    Type *array;
} Vector;

Vector *vec_make(void){
    Vector *v = malloc(sizeof(*v));
    if(v){
        v->size = 0;
        v->capacity=16;
        v->array = malloc(v->capacity * sizeof(Type));
    }
    return v;
}

void vec_free(Vector *v){
    free(v->array);
    free(v);
}

void vec_add(Vector *v, Type value){
    v->array[v->size++] = value;
    if(v->size == v->capacity){
        Type *temp;
        temp = realloc(v->array, sizeof(Type)*(v->capacity += 16));
        if(!temp){
            perror("realloc at vec_add");
            vec_free(v);
            exit(-1);
        }
        v->array = temp;
    }
}

int main(void){
    size_t size = snprintf(NULL, 0, "%d", INT_MIN);
    char buffer[size+1];
    int ch, i = 0;
    Vector *v = vec_make();

    while(1){
        ch=getchar();
        if(isspace(ch)){
            if(i == 0){
                if(ch == '\n')
                    break;
                continue;
            }
            buffer[i] = 0;
            //buffer validate as int => omitted
            vec_add(v, atoi(buffer));
            if(ch == '\n')
                break;
            i = 0;
        } else {
            if(ch == EOF)
                break;
            buffer[i++] = ch;
            if(i == size){
                fprintf(stderr, "error : too long\n");
                //skip upto delimiter?
                i = 0;
            }
        }
    }
    //print
    for(i = 0; i < v->size; ++i){
        if(i)
            putchar(',');
        printf("%d", v->array[i]);
    }
    putchar('\n');
    vec_free(v);
    return 0;
}

而不是

<i class="fa fa-smile-o" >
  <span id="yourSpanID"></span>
</i>

并将此代码添加到您的回调ReadUser

<i class="fa fa-smile-o" >Hello <readUser.name> ???
        </i>