Question

问题： - 调用ajax请求并在html中写入文本。

问题： - 第一次调用ajax并成功写入div中的值 - 第二次ajax获取数据（在页面源中）但div中的值不会更改，尽管cache：false。 - 我尝试生成随机数以便很好地显示问题。

代码：

1-Ajax电话：

$("#Finish").click(function () {
     $.ajax({
         type: 'POST',
         async: true,
         url: document.location.origin + "/air/ajaxCalls.php",
         dataType: 'json',
         cache: false,
         data: {
             ajaxType: "Finish",
             examid: 1,
             index: 2,
             qid: <? php echo $currentquestion ?> ,
             ansid: $('#tags').val(),
         },
         success: function (data) {
             //    alert("success");
             if (data) {
                 //    alert(data.status); 
                 // $("questiontext").html("next question");
                 // alert("data");
                 // alert('empty')

                 $('#tags').val("");

                 document.getElementById('questiontext').innerHTML = "<p>" + "<?php echo mt_rand() . getQuesName($currentquestion) . rand(); ?>" + "</p>";
                 document.getElementById('answerstext').innerHTML = "<?php getAnswers($currentquestion); ?>"

                 $("#questiontext").html("<?php echo mt_rand()?>");

                 $('input[type="checkbox"]').on('change', function () {
                     $('input[type="checkbox"]').not(this).prop('checked', false);
                 });

                 $('#check1').click(function () {});
                 $('#choose1, #check1').click(function () {
                     $('#check1').click();
                 });

                 $('#check2').click(function () {});
                 $('#choose2, #check2').click(function () {
                     $('#check2').click();
                 });

                 $('#check3').click(function () {});
                 $('#choose3, #check3').click(function () {
                     $('#check3').click();
                 });

                 $('#check4').click(function () {});
                 $('#choose4, #check4').click(function () {
                     $('#check4').click();
                 });

                 function Populate() {
                     vals = $('input[type="checkbox"]:checked').map(function () {
                         return this.value;
                     }).get().join(',');
                     // console.log(vals);
                     $('#tags').val(vals);
                 }

                 $('input[type="checkbox"]').on('change', function () {
                     Populate()
                 }).change();



                 if (data.status == 1) { ///sucess
                     alert('answer inserted');
                 }

             } else {
                 alert("Error : Please try again");
                 return false;
                 // no data found
             }
         },
         error: function (XMLHttpRequest, textStatus, errorThrown) {
             alert("Error : " + errorThrown);
         }
     });

 });

2 - 接听电话：

 if ($_POST['ajaxType'] == "Finish") {
     echo json_encode(array("status" => 1));
 }

3- div（html）

<div id="questiontext">
    <p>

    </p>
</div>

Answer 1

几天前，我有同样的问题。问题在于你的AJAX调用：

  $.ajax({
     type: 'POST',
     async: true,
     url: document.location.origin + "/air/ajaxCalls.php",
     dataType: 'json',
     cache: false,
     data: {
         ajaxType: "Finish",
         examid: 1,
         index: 2,
         qid: <? php echo $currentquestion ?> ,
         ansid: $('#tags').val(),
     },

将您的网址更改为主要的wordpress AJAX文件。通常可以在您网站的/ wp-admin /文件夹中找到它。从

更改网址后

document.location.origin + "/air/ajaxCalls.php"

到

../../wp-admin/admin-ajax.php

进入主函数文件并添加新的AJAX调用。例如，创建如下内容：

add_action("wp_ajax_populate", "populate");

function(populate){
 if (data) {
             //    alert(data.status); 
             // $("questiontext").html("next question");
             // alert("data");
             // alert('empty')

             $('#tags').val("");

             document.getElementById('questiontext').innerHTML = "<p>" + "<?php echo mt_rand() . getQuesName($currentquestion) . rand(); ?>" + "</p>";
             document.getElementById('answerstext').innerHTML = "<?php getAnswers($currentquestion); ?>"

             $("#questiontext").html("<?php echo mt_rand()?>");

             $('input[type="checkbox"]').on('change', function () {
                 $('input[type="checkbox"]').not(this).prop('checked', false);
             });

             $('#check1').click(function () {});
             $('#choose1, #check1').click(function () {
                 $('#check1').click();
             });

             $('#check2').click(function () {});
             $('#choose2, #check2').click(function () {
                 $('#check2').click();
             });

             $('#check3').click(function () {});
             $('#choose3, #check3').click(function () {
                 $('#check3').click();
             });

             $('#check4').click(function () {});
             $('#choose4, #check4').click(function () {
                 $('#check4').click();
             });

             function Populate() {
                 vals = $('input[type="checkbox"]:checked').map(function () {
                     return this.value;
                 }).get().join(',');
                 // console.log(vals);
                 $('#tags').val(vals);
             }

             $('input[type="checkbox"]').on('change', function () {
                 Populate()
             }).change();



             if (data.status == 1) { ///sucess
                 alert('answer inserted');
             }

         } else {
             alert("Error : Please try again");
             return false;
             // no data found
         }
     },
}

现在你在functions.php文件而不是你的jquery文件中有你的populate函数。这使得您只需要对AJAX调用进行操作就可以指定要执行的操作。这适合添加

"action":"populate",

进入你的数据阵列。

希望这有点帮助，如果我能澄清更多，请告诉我。

wordpress：在按钮单击中调用ajax

1 个答案: