未捕获的语法错误：带有 json 响应的意外字符串

Question

我收到一个未捕获的语法错误：运行 ajax 时 Chrome 控制台出现意外字符串，我试图在 html 表的底部添加一行，并使用 json 返回保存的数据。实在看不出来……

function create_person() {
    console.log("create person is working!")
    $.ajax({
        url : "{% url 'tande:create_person' %}",
        type: "POST",
        data: { first_name : $('#person-first-name').val(), surname : $('#person-surname').val(), email : $('#person-email').val(), coach_id : $('#person-coach-id').val(), is_coach : $('#person-is-coach').val(), position : $('#person-position').val(), contract_type : $('#person-contract').val()},

        success : function(json) {
            $('#person-first-name').val('');
            $('#person-surname').val('');
            $('#person-email').val('');
            $('#person-coach-id').val('');
            $('#person-is-coach').val('');
            $('#person-position').val('');
            $('#person-contract').val('');
            console.log(json);
            // ERROR OCCURS ON FOLLOWING LINE
            var html = '<tr><td>'+json.personid+'</td><td>'+json.personfirstname+'&nbsp;'+json.personsurname'</td><td>'+json.personposition+'</td><td>'+json.personcontract+'</td><td>'+json.personemail+'</td><td>'+json.personcoachid+'</td></tr>';
            console.log("success"); 
            $('div#talk').html(html);
            console.log(html)
        },

        error : function(xhr,errmsg,err) {
            // $('#results').html("<div class='alert-box alert radius' data-alert>Oops! We have encountered an error: "+errmsg+
            //     " <a href='#' class='close'>&times;</a></div>"); // add the error to the dom
            console.log("uh oh"); 
            }
        });
    };

数据保存成功，控制台返回json对象，就是显示不出来。

def create_person(request):
    if request.method == "POST":
        print "request post data in view"
        firstname = request.POST.get('first_name')
        print firstname
        lastname = request.POST.get('surname')
        emailadd = request.POST.get('email')
        coachid = request.POST.get('coach_id')
        isacoach = request.POST.get('is_coach')
        positionheld = request.POST.get('position')
        contracttype = request.POST.get('contract_type')

        response_data = {}

        starfruit = Person(first_name=firstname, surname=lastname, email=emailadd, coach_id=coachid, assign_as_coach=isacoach, position=positionheld, contract_type=contracttype)
        starfruit.save()

        response_data['personfirstname'] = starfruit.first_name
        response_data['personsurname'] = starfruit.surname
        response_data['personemail'] = starfruit.email
        response_data['personcoachid'] = starfruit.coach_id
        response_data['personiscoach'] = starfruit.assign_as_coach
        response_data['personposition'] = starfruit.position
        response_data['personcontract'] = starfruit.contract_type
        response_data['personid'] = starfruit.id
        # response_data = {
        # ''
        # }
        print response_data

        return JsonResponse(response_data)

    else:
        print "no post request in view"
        return JsonResponse(response_data)

我在控制台中遇到的错误如下：

(index):845 Uncaught SyntaxError: Unexpected string

它指的是我上面突出显示的那一行

var html = '<tr><td>'+json.personid+'</td><td>'+json.personfirstname+'&nbsp;'+json.personsurname'</td><td>'+json.personposition+'</td><td>'+json.personcontract+'</td><td>'+json.personemail+'</td><td>'+json.personcoachid+'</td></tr>';

我不确定还有什么方法可以解决这个问题...

Answer 1

您在json.personsurname 和以下'</td><td>' 之间缺少+。

一般来说，像这样构建 HTML 是一个非常糟糕的主意；这种事情很容易错过。