Javascript PHP&；AJAX—获取到另一个页面并将其作为模式发送时，不刷新数据

我现在发送数据到另一个页面而不刷新，但我的问题是模式，我不能将其作为模式发送，但我可以将数据发送到文本中。为什么?

这是我的页面的图片

这是我的密码

对于ajax4.html

这是我提交数据和执行插入的地方
AJAX POST表单
document.getElementById（'postForm'）。addEventListener（'submit'，postName）；
函数postName（e）{
e、 预防默认值（）；
var name=document.getElementById（'name2'）.value；
var params=“name=”+name
;
var xhr=new XMLHttpRequest（）；
open（'POST'，'process.php'，true）；
setRequestHeader（'Content-Type'，'application/x-www-form-urlencoded'）；
xhr.onload=函数（）{
console.log（this.responseText）；
}
xhr.send（参数）；
}

myajax5.html

这是我获取数据的地方，也是我想显示模态的地方

**EDIT** here is my current HTML 


            <h1>Users</h1>
        <div id="users"></div>


<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">User List</h4>
      </div>
      <div class="modal-body" id="user-list">
        <p>User list here</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>



<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>


<script>
var still_fetching = false;

//fetch data every 3 seconds (3000)
setInterval(function(){ 
     if (still_fetching) {
         return;
     }
     still_fetching = true;
     loadUsers();
}, 3000);

//need to update a bit this function
function loadUsers(){
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'users.php', true);

        xhr.onload = function(){
            if(this.status == 200){
                var users = JSON.parse(this.responseText);

                var output = '';

                for(var i in users){
                output += '<div id="myModal" class="modal">' +    
                    '<div class="modal-content">' +
                        '<span class="close">&times;</span>' +
                        '<p>'+users[i].id+'</p>' +
                        '<p>'+users[i].name+'</p>' +
                      '</div>' +
                    '</div>';

                }

                //document.getElementById('users').innerHTML = output;
                document.getElementById('user-list').innerHTML = output;
                document.getElementById('myModal').style.display = "block";  //show modal
                still_fetching = false;
            }
        }

        xhr.send();
}
</script>
</body>
</html>

**编辑**这是我当前的HTML
使用者
&时代；
用户列表
用户列表在这里

关
var still_fetching=false；
//每3秒获取一次数据（3000）
setInterval（函数（）{
如果（仍然取数）{
回来
}
仍然取数=真；
loadUsers（）；
}, 3000);
//这个函数需要更新一点
函数loadUsers（）{
var xhr=new XMLHttpRequest（）；
open（'GET'，'users.php'，true）；
xhr.onload=函数（）{
如果（this.status==200）{
var users=JSON.parse（this.responseText）；
var输出=“”；
for（用户中的var i）{
输出+=''+
'' +
“×；”+
“”+用户[i].id+”
'+
“”+用户[i].名称+”
'+
'' +
'';
}
//document.getElementById（'users'）.innerHTML=output；
document.getElementById（'user-list'）。innerHTML=输出；
document.getElementById（'myModal'）.style.display=“block”//show modal
仍然取数=假；
}
}
xhr.send（）；
}

process.php

---

假设您的模式使用引导：

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">User List</h4>
      </div>
      <div class="modal-body" id="user-list">
        <p>User list here</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>


&时代；
用户列表
用户列表在这里

关

编辑您的JS函数：

function loadUsers(){
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'users.php', true);

        xhr.onload = function(){
            if(this.status == 200){
                var users = JSON.parse(this.responseText);

                var output = '';

                for(var i in users){
                output +=
                    '<div>' +
                        '<p>'+users[i].id+'</p>' +
                        '<p>'+users[i].name+'</p>' +
                    '</div>';

                }

                //document.getElementById('users').innerHTML = output;
                document.getElementById('user-list').innerHTML = output;
                document.getElementById('myModal').style.display = "block";  //show modal
                still_fetching = false;
            }
        }

        xhr.send();
}

函数loadUsers（）{
var xhr=new XMLHttpRequest（）；
open（'GET'，'users.php'，true）；
xhr.onload=函数（）{
如果（this.status==200）{
var users=JSON.parse（this.responseText）；
var输出=“”；
for（用户中的var i）{
输出+=
'' +
“”+用户[i].id+”
'+
“”+用户[i].名称+”
'+
'';
}
//document.getElementById（'users'）.innerHTML=output；
document.getElementById（'user-list'）。innerHTML=输出；
document.getElementById（'myModal'）.style.display=“block”//show modal
仍然取数=假；
}
}
xhr.send（）；
}
您的代码中有一些问题

1.检查名称参数：

如果（isset（$\u GET['name']））

但当你得到它时，你不提供它

open（'GET'，'users.php'，true）

提供它

xhr.open('GET', 'users.php?name=shingo', true);

2.响应不是JSON字符串：

echo“GET:你的名字是”$_获取['name']

parse（this.responseText）

没有显示sir I链接引导，但仍然没有显示，它只显示按钮和用户SPlus没有弹出任何内容，sir，自动显示模式：（你粘贴了模式html标签吗？如果你使用设置间隔，模式将每3秒弹出一次，除非你每次点击按钮都想弹出模式
你是什么意思？@shingo？我可以传递文本，但不能传递模式。你有什么建议或解决方案吗？先生，请给我一个解决方案“我对ajax非常陌生：（为第一个问题添加解决方案，第二个问题，您需要以JSON格式返回您自己的数据。您显示的是返回一个字符串：
'GET:your name is.$\u GET['name']
sir，@shingo如果您能编辑我的代码，我将不胜感激。感谢您，sir good bles您使用的是哪个版本的引导，您是否添加了jquery？
function loadUsers(){
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'users.php', true);

        xhr.onload = function(){
            if(this.status == 200){
                var users = JSON.parse(this.responseText);

                var output = '';

                for(var i in users){
                output +=
                    '<div>' +
                        '<p>'+users[i].id+'</p>' +
                        '<p>'+users[i].name+'</p>' +
                    '</div>';

                }

                //document.getElementById('users').innerHTML = output;
                document.getElementById('user-list').innerHTML = output;
                document.getElementById('myModal').style.display = "block";  //show modal
                still_fetching = false;
            }
        }

        xhr.send();
}

xhr.open('GET', 'users.php?name=shingo', true);