Ajax 成功返回注释 Html 标记

Question

我正在尝试设置一个选择框，该框将根据州的先前选择显示城市。基本上，我使用 ajax 来运行我的 php.file 来填充我的<option>. 在php文件中我成功通过了预选状态来查询数据库。但是，现在，为了填充<option>我正在使用 ajax 成功调用 php 文件，但是，每当我尝试传递包含 php 代码的变量时，它都会显示用!--和注释--。//  hmtl<select id="select-city" required ><option disabled selected>Selecione sua Cidade</option></select>// js codefunction fillSelectCity () {    var getState = document.getElementById('selectState');    var stateID = getState.options[getState.selectedIndex].value;    $.ajax ({    type: "POST",     url: "fillcity.php",    data: { stateID : stateID },    success:  function (){        var phpfile = "'fillcity.php'"        var tag = "<?php include_once " + phpfile + " ?>";        $('#select-city').html(tag);/// here the output is "<!-- ?php include_once 'fillcity.php' ? -->"    }        }) }//php file<?php $conn = mysqli_connect("host", "user", "pass", "db");if(isset($_POST['stateID'])){    $stateID = $_POST['stateID'];}$query = "SELECT * FROM states WHERE stateID = '$stateID'"; $result_one = mysqli_query($conn, $query);$row = mysqli_fetch_assoc($result_one); //my table has a specific ID for each state, so I am fetching the acronoym of the state according to the id;$stateUf = $row['uf']; // passing the acronym to the $stateUfmysqli_free_result($result_one);$queryCity = "SELECT * FROM city WHERE Uf = '$stateUf'"; //query all cities with the acronymif ($result = mysqli_query($conn, $queryCity)){    while ($row = mysqli_fetch_assoc($result)){        $id = $row['cityID'];        $name =  $row['cityName'];        $name = utf8_encode($name);        echo <<< EOT        "<option value="$id">$name</option>"EOT;    }    mysqli_free_result($result);}    else {echo "<option>Error</option>";}?> 我希望通过循环遍历cityphp 文件中的表来填充我的选择选项。该标签<?php include_once 'fillcity.php' ?>用于填充状态选择。也许，可能有一种更直接的方法来相应地填充，但由于我是编程新手，我正在尝试自己解决问题。但是，请随意推荐其他方法，因为我不确定我打算做的事情是否会奏效。谢谢！

Answer 1

你可以试试这个。您可以稍后对其进行修改以进行改进。

阅读.php

<?php

    //include header

    header('Content-Type: application/json');

$conn= mysqli_connect("localhost","my_user","my_password","my_db");

if (mysqli_connect_errno()){

  echo "Failed to connect to MySQL: " . mysqli_connect_error();

}

$type = $_GET["type"];

if($type == "GetState"){

    //SAMPLE QUERY

    $sql = "SELECT StateID,StateName from State";

    $data = array();

    $results = $db -> query($sql);

    while($row = mysqli_fetch_assoc($results)){

        $data[] = $row;

    }

    echo json_encode($data);

}

if($type == "GetCity"){

    $StateID= $_POST["StateID"];

    //SAMPLE QUERY

    //LET'S ASSUME THAT YOU HAVE FOREIGN KEY

    $sql = "SELECT CityID,CityName from City where StateID = '".$StateID."'";

    $data = array();

    $results = $db -> query($sql);

    while($row = mysqli_fetch_assoc($results)){

        $data[] = $row;

    }

    echo json_encode($data);

}

?>

索引.html

<select id="state"></select>

<select id="city"></select>

<!--PLEASE INCLUDE JQUERY RIGHT HERE E.G. <script src='jquery.min.js'></script>--> 

<!--DOWNLOAD JQUERY HERE https://jquery.com/-->

<script>

    LoadState();

    function LoadState(){

        $.ajax({

            url:"read.php?type=GetState",

            type:"GET",

            success:function(data){

                var options = "<option selected disabled value="">Select 

State</option>";

            for(var i in data){

                options += "<option value='"+data[i].StateID+"'>" + data[i].StateName+ "</option>";

            }

            $("#state").html(options);

        }

    });

}

function LoadCity(StateID){

    $.ajax({

        url:"read.php?type=GetCity",

        type:"POST",

        data:{

            StateID: StateID

        },

        success:function(data){

            var options = "<option selected disabled value="">Select City</option>";

            for(var i in data){

                options += "<option value='"+data[i].CityID+"'>" + data[i].CityName+ "</option>";

            }

            $("#city").html(options);

        }

    });

}

$("#city").change(function(){

    LoadCity(this.value);

});

Answer 2

你不需要include 'fillcity.php。AJAX 调用运行该脚本，响应是输出。它将在成功函数的参数中。

function fillSelectCity () {

    var getState = $("#selectState").val();

    $.ajax ({

        type: "POST", 

        url: "fillcity.php",

        data: { stateID : stateID },

        success:  function (tag){

            $('#select-city').html(tag);

        }    

    });

 }