php - 使用 MySQL 条目将按钮连接到 JavaScript 函数

Question

我在数据库中有一个表，我想使用 JavaScript 中的 XMLHttpRequest 将其呈现到 PHP 页面。我想将表格中的每个条目呈现为 HTML 行/单元格，并在每个“条目”中有两个按钮。我想让条目中的每个按钮都调用一个特定的 JavaScript 函数来处理逻辑。

所以基本上，如果我在表中有 10 行，我将有 20 个按钮，每个按钮将根据单击的按钮的“类型”将参数传递给两个函数。

关于我如何去做这件事的任何想法？

谢谢！

Answer 1

在您的服务器上，您需要一个 PHP 文件/操作来执行以下操作：

$return = array();
$q = mysql_query('SELECT * FROM ...');
while(($return[] = mysql_fetch_assoc($q)) !== false);
echo json_encode($return);

在预构建的 HTML 页面中，您需要一个容器来打印数据：

<div id="db-container"></div>

然后是该页面中包含的 JS（我在这里使用 jQuery 是为了简单和易读，尽管您可以使用本机 JS 或任何其他 JS 工具来完成）：

function getDB() {
  $.getJSON(
    'http://url.to/your/code.php',
    {},
    function(data) {
      var renderedHTML = '';
      /* parse the object representing PHP's $return, mainKey will be numerical keys */
      for(var mainKey in data) {
        /* one main loop iteration == one table row */
        renderedHTML += '<tr>'
        /* data[mainKey] is a row in DB, subKey will contain a name of a DB table column */
        /* data[mainKey][subKey] will therefore contain the value of DB table column 'subKey' for the DB table row numbered 'mainKey' */
        for(var subKey in data[mainKey]) {
          renderedHTML += '<td>' + data[mainKey][subKey] + '</td>'
        }
        /* statically add another HTML table column for the buttons */
        renderedHTML += '
          <td>
            <input type="button" name="b1" onclick="func1(\'arg1\')">
            <input type="button" name="b2" onclick="func2(\'arg2\')">
          </td>
        ';
        renderedHTML += '</tr>'
      }
      /* insert the built table into the page */
      $('#db-container').html('<table>' + renderedHTML + '</table>');
    }
  );
}

希望这可以帮助。