Question

我正在尝试在输入字段上输入一些文本，并在click的按钮上输入另一个输入字段名称autofiller上来自mysql的数据。

$(function () {
  $('#button').on('click', function () {
    var text = $('#fromInput');
    $.ajax({
      url:"serv.php",
      method: "GET",
      data: {
        "id": text
      },
      success: function(data) {
        var name=JSON.parse(data);
        document.getElementsByClassName("autofiller").value=name.name;
      }
    });
  });
});

HTML表单

<form id="sampleForm">
 <input type="text" id="fromInput" />
 <input type="text" class="autofiller"/>

 <input type="button" value="button" id="button">

这是我的后端php脚本->

<?php
    $link=mysqli_connect("localhost","root","","employee");



    $data=$_GET["id"];

  $result = mysqli_query($link,"SELECT * FROM user where userid='$data'");

  header('Content-type:application/json');
  exit(json_encode($result));
 ?>

Answer 1

我希望这会帮助您解决

$(function () {
 $('#button').on('click', function () {
    var text = $('#fromInput');
    $.ajax({
      url:"serv.php",
      method: "GET",
      data: {
        "id": text
      },
      success: function(data) {
        var name=JSON.parse(data);
        $(".autofiller").val(name.name);// Try this 
      }
    });
  });
});

Answer 2

也许您应该尝试以下方法：

 var text = $('#fromInput').val();

更新

您的代码中有许多错误，如下所示：

在后端

$result = mysqli_query($link,"SELECT * FROM user where userid='$data'");

这不会返回您期望的数据，您必须使用 mysql_fetch_array 从结果中获取数据，可能是这样的：

 $sql = "SELECT * FROM users where id='$data'";
 $result = mysqli_fetch_array(mysqli_query($link,$sql));

在前端 您无需将数据解析为JSON，因为您已经使用JSON数据发送了响应：

 var name=JSON.parse(data);

相反，您可以执行以下操作：

 document.getElementById("autofiller").value=data.name;

请注意，使用id代替类是一种更好的方法，因为您希望将值设置为特定的输入，而不是一组输入，因此您可能需要像这样将id添加到自动填充器中

<input type="text" class="autofiller" id="autofiller"/>

Answer 3

document.getElementsByClassName("autofiller")[0].value=name.name;

Answer 4

您应该使用getElementById()来获取单个元素引用，因为getElementByClassName()将返回具有该类名称的元素的引用数组。

尝试

document.getElementById("autofiller").value=name.name;

其中自动填充器应为“ id”而不是类

以HTML

<input type="text" id="autofiller"/>

OnClick按钮从数据库获取并实时显示在输入字段中

4 个答案: