Javascript Div内容没有'；t第一次单击时更改

我对更改div的内容有问题。我首先进行一个ajax调用，然后从服务器接收一个JSON数组。到目前为止，一切顺利。然后，我想将几个div的内容更改为我从服务器收到的内容。问题是内容不会在第一次单击时更改。每次回复都是OK的，我已经和Fiddler核对过了，并且在我的代码中，我收到了正确的回复。但是，谜团仍然存在，为什么我的页面上的div没有随着第一次点击而改变，为什么我每次都要点击两次？我花了好几个小时才弄明白这一点，尝试了一切，似乎没有什么合乎逻辑的。以下是我的代码（项目是MVC4）：

$（'#btnsearch'）。单击（函数（）
{
var searchStr=$（'#txtSearch'）.val（）；
var noOfPages=1；
$.ajax({
类型：“POST”，
数据类型：“json”，
url:$（'#btnsearch'）。数据（'request-url'），/*Razor页面中的url*/
数据：{pageNo:noofpage，searchString:searchStr}，/*MVC4调用*/
成功：函数（jsontext）
{ 
$（'hiddenSearchResult'）.val（jsontext）；
},
错误：函数（）
{
警报（'搜索时出错！'）；
}
});
var json=$（'#hiddenSearchResult'）.val（）；
如果（json.length==0）{alert（'结果为空！'）；
return；}/*带空json，解析抛出错误*/
json=json.parse（json）；
if（json.Content==未定义）返回；
for（var i=0；i

来自

var json=$（'hiddenSearchResult'）.val（）的代码将在AJAX请求启动后立即执行，但在请求完成之前执行，因此此时
$（'hiddenSearchResult'）
尚未填充

当您第二次单击该按钮时，它已被AJAX请求的完成填充，因此，
$之后的代码将按预期执行

您应该将代码移动到
success
函数中，以便在AJAX请求完成时执行所有代码。
它是异步的，您需要等待结果出来

$('#btnsearch').click(function ()
{
   var searchStr = $('#txtSearch').val();
   var noOfPages = 1;

  $.ajax({
    type: "POST",
    datatype: 'json',
    url: $('#btnsearch').data('request-url'),/*URL from Razor's page*/
    data: { pageNo: noOfPages, searchString: searchStr },/*MVC 4 call*/
    success: function (jsontext)
    { 
        if (jsontext.length === 0){ alert('result is empty!');
           return;
        }/*with empty json, parsing throws error*/
       var json = JSON.parse(jsontext);
       if (json.Content == undefined) return;

        for (var i = 0; i < json.Content.length; i++) {
        switch (i) {
            case 0:
                $('#snippetsdivinner').html(json.Content[i].ContentString);
                break;
            case 1:
                $('#snippetsdivinner1').html(json.Content[i].ContentString);
                break;
            case 2:
                $('#snippetsdivinner2').html(json.Content[i].ContentString);
                break;
            case 3:
                $('#snippetsdivinner3').html(json.Content[i].ContentString);
                break;
        }
    }
        },
        error: function ()
        {
            alert('Error when searching!');
        }
    });
});

$（'#btnsearch'）。单击（函数（）
{
var searchStr=$（'#txtSearch'）.val（）；
var noOfPages=1；
$.ajax({
类型：“POST”，
数据类型：“json”，
url:$（'#btnsearch'）。数据（'request-url'），/*Razor页面中的url*/
数据：{pageNo:noofpage，searchString:searchStr}，/*MVC4调用*/
成功：函数（jsontext）
{ 
如果（jsontext.length==0）{alert（'结果为空！'）；
回来
}/*如果json为空，解析将抛出错误*/
var json=json.parse（jsontext）；
if（json.Content==未定义）返回；
for（var i=0；i
您可能还需要将所有代码从

var json = $('#hiddenSearchResult').val();

在ajax的成功回调中。
如果在ajax调用中使用
数据类型：“json”
，则不必执行
json=json.parse（json）。


其他的答案是关于将所有代码放入
success
回调函数的。
这不是因为异步调用吗？点击并不等待您收到数据，而是继续执行。我将我的代码放入ajax的success属性中，工作起来很有魅力。不工作的唯一原因是没有等待对finnish的异步调用，正如您所提到的。如果我不使用JSON.parse（JSON），那么我就无法遍历JSON数组，代码也无法工作。
var json = $('#hiddenSearchResult').val();