javascript - 文本未标记

Question

我正在编写一个页面，允许锦标赛总监 (TD) 将玩家添加到事件中。当 TD 搜索玩家时，我希望搜索结果显示在搜索输入下方的键盘上(无需刷新页面)。 在这个阶段，我有 2 个 php 页面和 1 个 js 页面，并且进行了实时搜索，但输出没有被标记。我已经编写了一段代码来将 PHP $_SESSION[''] 数组转换为 javascript 数组，但是我的大脑正在煎熬，我不知道从这里该去哪里。

我实际上希望将此代码的处理版本作为输出(假设 SQL 仅返回 1 个名为 John Smith 的玩家)

<tr></td> 123 </td><td> John Smith </td></tr>

我的 php 主页面有:

<table border='1px'>
<tr><th colspan='6'> <?php echo ($eName . " - " . $vn); ?></th></tr>
<tr><th>Player ID</th>
<th>Player Name</th>
<th>Place</th>
<th>Points</th>
<th>Cash</th>
<th>Ticket?</th></tr>

<tr><td colspan='3'>Search <input type='text' id='newsearch'</input>
</table>
<br>

<div id="newsearch-data"> </div>

<script>
 var players = [];   
</script>    

<?php

//Makes php array into js array
foreach ($_SESSION['players'] as $id){
echo "<script> players.push('" . $id . "') </script>";
}

?>
<script src="http://code.jquery.com/jquery-1.8.0.min.js"> </script>
<script src="global.js"> </script>

js页面:

$('input#newsearch').on('keyup', function(){
    var newsearch = $('input#newsearch').val();
    if ($.trim(newsearch)!= "") {
        $.post('newsearch.php', {newsearch: newsearch}, function(data) {
            $('div#newsearch-data').text(data);
        });
    }
});

和第二个 php 页面

<?php
  session_start();
  unset($_SESSION['players']);
if (isset($_POST['newsearch']) === true && empty($_POST['newsearch'] === false)){
require 'dbconnect.php';

$term = $_POST['newsearch'];
$terms = "%" . $term . "%";

$_SESSION['players'] = array();

$query = ("SELECT * FROM players WHERE Username LIKE '$terms'");
$run_query = mysqli_query($dbcon, $query);

        while ($dbsearch = mysqli_fetch_assoc($run_query))
         {
         array_push ($_SESSION['players'],$dbsearch['PlayerID']);
           echo "<tr><td>" . $dbsearch['PlayerID'] . "</tr></td>";

         }}?

如何在 html 表格上输出新行而不是原始 html 代码？

Answer 1

替换$('div#newsearch-data').text(data);

与$('div#newsearch-data').html(data);

$.text() 对输入字符串进行转义，当您知道输入是字符串并且希望“按原样”预设它时，应该使用它。如果输入包含您想要注入(inject) DOM 的实际 HTML，$.html() 是您的 friend :-)