Json響應數據不會追加到div

Question

我不理解成功函數有什么問題，因為ajax調用可以正常工作並且數據在視圖中進行處理，但是在成功函數中，數據不會附加到div。

我的jQuery

$(document).ready(function() {
   $('#other').click(function() {
        var filename = "{{filename}}";
        var count = $("#count").val();

          $.ajax({
                type: 'POST',
                url: '/increment_page/',
                data: {'name':filename,'count':count,'csrfmiddlewaretoken': '{{ csrf_token }}',},
                dataType: 'jsonp',
                success: function(data) {

                 $( "#show" ).html(data.result);

                 }
             });

    });
});

模板

<div id="filename">{{filename}}</div>
<input type="text" id ="count" value='1'>
<button id="other">Click
</button>
<div id="show">
{{result|first|slice:"1:"}}
</div>

Views.py

def increment_page(request):
#If the AJAX request
if request.is_ajax() and request.POST:
    try:
        #Get the filename
        name = request.POST['name']
        pdf = pyPdf.PdfFileReader(open(name, "rb"))
        result=[]
        #Extract the file contents
        for page in pdf.pages:
            result.append(page.extractText())
        result = [x for x in result if x != '']
        #Get the count
        count = int(request.POST['count'])
        #Increment the count


        #Get the list item at the count(position)p
        result=result[count]
        my_dict={}
        my_dict={'result':result,'count':count}
        #print(my_dict)
        data =json.dumps(my_dict)
        return HttpResponse(data,content_type='application/json')

    except:
        e = sys.exc_info()
        return HttpResponse(e)

else:
    raise Http404
#return render(request,'view2.html',{'my_dict':my_dict,'result':result})

Answer 1

既然您評論了您的響應已被打印到命令提示符，所以我假設您正在成功調用函數，它應該是正確的。 以防萬一，請在您的ajax調用中添加以下行以記錄錯誤，如有，請對其進行評論。

error: function(xhr, status, error) {
  var err = eval("(" + xhr.responseText + ")");
  alert(err.Message);
}

如果您通過單擊按鈕來調用ajax，並且正在提交表單，請阻止該事件。

    $(document).ready(function() {
     $('#other').click(function(e) {

      e.preventDefault();

      var filename = "{{filename}}";
      var count = $("#count").val();

      $.ajax({
       type: 'POST',
       url: '/increment_page/',
       data: {'name':filename,'count':count,'csrfmiddlewaretoken': '{{ csrf_token }}',},
       dataType: 'jsonp',
       success: function(data) {

        $( "#show" ).html(data.result);

       },
       error: function(xhr, status, error) { 
          var err = eval("(" + xhr.responseText + ")");
          console.log(err.Message);
          //alert(err.Message);  //you can use either of these to  display error
       }
      });

     });
    });

抱歉要求您評論任何錯誤。 我還不能對問題發表評論，因此我必須將其包括在答案中。