Question

好的，所以我有这个搜索框，人们在其中输入食物。当他们按下按钮时，我需要将该输入发送到.php文件。该php文件将查看该食品的卡路里（在我的数据库中），并输出食品名称和卡路里。所有这些都需要在不重新加载页面的情况下完成，所以我开始弄清楚JQuery是如何工作的。

但是我被卡住了，我不知道在jquery函数的数据字段中放什么以及如何在'.php文件中“捕获”该数据。有人可以给我一个想法吗？非常感谢！（请参阅??????对于我不理解的事情）。此外，返回的数据最终不需要在警告框中，而是更新我页面上的某些表格，我该怎么做？我需要哪个JSON（？）Jquery函数？

到目前为止我的所作所为：

头部：

<script type="text/javascript">
function contentDisp()
{

$.ajax({
  type: 'POST',
  url: 'getFood.php',
  data: '????????',
  success: function(data){ 
    alert("Data Loaded: " + data); 
  }

});

}
</script>

和身体：

<form autocomplete="off">
        <p>
            Product:
            <input type="text" name="food" id="food" class="food_name_textbox" onmouseover="javascript: this.className='food_name_textbox_mouseover';" onmouseout="javascript: this.className='food_name_textbox';" / >
        </p>
        <button id="zoek" type="button" onClick="contentDisp();">Zoek</button>
    </form>

和getFood.php：

<?php
require_once "config.php";
$id = "??????"
$result = mysql_query("SELECT * FROM voedingswaarden WHERE voedsel='$id'");
$row = mysql_fetch_array($result);

echo json_encode($row);

?>

Answer 1

<script type="text/javascript">
function contentDisp()
{
var textSearch = $("#myText").text();

$.ajax({
  type: 'POST',
  url: 'getFood.php',
  data: textSearch,
  success: function(data){ 
    alert("Data Loaded: " + data); 
  }

});

}
</script>

PHP：

$id = $_POST['textSearch'];

Answer 2

$.ajax({
  type: 'POST',
  url: 'getFood.php',
  data: {'foodnametextbox' : $('#food').val() },
  datatype: "json",
  success: function(data){ 
    $('#table').html(data);
  }
});

<?php
require_once "config.php";
$id = $_POST['foodnametextbox']; //escape and validate this input before using it in a query
$result = mysql_query("SELECT * FROM voedingswaarden WHERE voedsel='$id'");
$row = mysql_fetch_array($result);

echo json_encode($row);

?>

使用JQuery获取数据库中的其余行

2 个答案: