如何将 Ajax 的结果（从服务器获取数据）放入输入标签？答案

【问题标题】：How do I put the result of Ajax (get data from server) into input tag?如何将 Ajax 的结果（从服务器获取数据）放入输入标签？
【发布时间】：2015-07-24 17:16:45
【问题描述】：

看我的照片：

我希望将结果填充到输入标签中。

如果我这样做，它会起作用：

<?php
    include('c2gcon.php');
    include('logincheckadmin.php');
    $nameajax=isset($_REQUEST['nameajax'])?$_REQUEST['nameajax']:null;
    if($nameajax<>null){
        $username=$nameajax;
        $_SESSION['simpanun8']=$_SESSION['simpanun8'].','.$username;
        $_SESSION['simpanun8'][0]='';
        echo "username=$_SESSION[simpanun8]";
        exit;
    }
?>
<html>
<head>
    <title>DELETE RECORD</title>
    <link rel="shortcut icon" href="http://c2gdragonteam.com/img/dragonhead.ico">
    <link href="/css/bootstrap.css" rel="stylesheet">
    <style>
        p,td {
            font-size: 70%;
        }
    </style>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-resource.min.js"></script>
</head>
<body ng-app="ctrljs">
<?php
    $_SESSION['simpanun8']=null;
    $ssloginadmin=$_SESSION['ssloginadmin'];
    $page=isset($_REQUEST['page'])?$_REQUEST['page']:null;
    if($page=='form'){
?>
    <form method='post' name='formupgrade' ng-controller='formctrl'>
        <table>
            <tr><td>Username : <em>(using comma if multiuser)</em></td></tr>
            <tr>
                <td>
                    <select name='username' id='username' ng-model='username' required>
                        <option value='' selected></option>
<?php
                            $q=mysql_query("SELECT username FROM t_un WHERE upgrade='1' and t1count='0' and t2count='0' ORDER BY username");
                            while($f=mysql_fetch_object($q)){
?>
                                <option value='<?php echo "$f->username";?>'><?php echo "$f->username";?></option>
<?php
                            }
?>
                    </select>
                    <input type='button' value='add' onclick='checkusername();'></input>
                </td>
            </tr>
            <tr>
                <td>
                    <input name='usernameresult' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/"></input>
                </td>
            </tr>
        </table>
        <input type='submit' value='submit' ng-hide="!formupgrade.$valid"></input>
    </form>
    <br>
    <div id='resultmunculdisini'></div>
<?php   
    }
?>
<script>
function checkusername(){
    var status = document.getElementById("resultmunculdisini");
    var u = document.getElementById("username").value;
    if(u != ""){
        status.innerHTML = "<font color='red'><img src='/img/loading.GIF'></img> checking...</font>";
        var hr = new XMLHttpRequest();
        hr.open("POST", "admintreedelrec.php", true);
        hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        hr.onreadystatechange = function() {
            if(hr.readyState == 4 && hr.status == 200) {
                status.innerHTML = hr.responseText;
            }
        }
        var v = "nameajax="+u;
        hr.send(v);
    }
}
</script>
<script>
var app = angular.module('ctrljs', []);
app.controller('formctrl', function($scope, $http){
  $scope.digits = {};
});
</script>
</body>
</html>

我正在使用 AJAX，如果我喜欢上面的话，它就像一个魅力，但我不知道如何将结果放入输入标签中。我试过这样，我将 ID (id='resultmunculdisini') 放在输入标签中，但没有任何反应：

            <tr>
                <td>
                    <input name='usernameresult' id='resultmunculdisini' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/"></input>
                </td>
            </tr>

我将旧 ID 更改为非活动状态，如下所示：

<!--<div id='resultmunculdisini'></div>-->

【问题讨论】：

标签： php ajax

【解决方案1】：

输入不会有innerhtml，它将有value。

document.getElementById("resultmunculdisini").value=hr.responseText;

您已将相同的 id(resultmunculdisini) 赋予多个 dom 元素（div 和 input）。 id 应该是唯一的。删除 div 的 id 为resultmunculdisini

另一个.php

<?php
    include('c2gcon.php');
    include('logincheckadmin.php');
    $nameajax=isset($_REQUEST['nameajax'])?$_REQUEST['nameajax']:null;
    if($nameajax<>null){
        $username=$nameajax;
        $_SESSION['simpanun8']=$_SESSION['simpanun8'].','.$username;
        $_SESSION['simpanun8'][0]='';
        echo "username=$_SESSION[simpanun8]";
        exit;
    }
?>

你的 php 脚本

    hr.open("POST", "another.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            status.innerHTML = hr.responseText;
        }
    }
    var v = "nameajax="+u;
    hr.send(v);

【讨论】：

感谢@Vishnu 的回答，但还不行。结果变成这样[i.imgur.com/ESeG057.jpg]，我把我的代码变成这样[i.imgur.com/DhOye6Z.jpg]。请再次帮助我，我认为它几乎是正确的。谢谢。
@Junaserbaserbi 使用another.php 文件来处理您的请求并发送响应。
以上所有代码都在 admintreedelrec.php 中。我只制作一页，而不是更多。
它有效@Vishnu，谢谢。结果是这样的[i.imgur.com/ofBYWoD.jpg]，你的解决方案是这样的[i.imgur.com/3kP0MvD.jpg]，太好了，谢谢。
毗湿奴，请在here再次帮助我

【解决方案2】：

这没有 XMLHttpRequest

<tr>
<td>
<input name='usernameresult' id='resultmunculdisini' ng-model='usernameresult' required ng-pattern="/^[A-Za-z0-9/\.\-\s\,]*$/" value="<?php echo "$_SESSION[simpanun8]";?>"></input>
</td>
</tr>

<form method='post' name='formupgrade' ng-controller='formctrl' action="admintreedelrec.php">
<select name='nameajax' id='username' ng-model='username' required>
<option value='' selected></option>
<?php
$q=mysql_query("SELECT username FROM t_un WHERE upgrade='1' and t1count='0' and t2count='0' ORDER BY username");
while($f=mysql_fetch_object($q)){
?>
<option value='<?php echo "$f->username";?>'><?php echo "$f->username";?></option>
<?php
                        }
?>
</select>
<input type='button' value='add' onclick='checkusername();'></input>
<input type='submit' value='add'></input>
</form>

【讨论】：