从数据库中填充 Datalist答案

【问题标题】：Populate Datalist from the Database从数据库中填充 Datalist
【发布时间】：2015-07-09 14:41:34
【问题描述】：

我是 javascript 和 php 的新手，但是我想从 mysql 表中填充数据列表，但有一些困难，相关代码如下所示。我能够从数据库中获取数据，但无法在 datalist 元素中显示它们。

HTML 代码

<form class="form" action="insert.php" method="post" name="access_form">

<ul>

<li>
<h2>Please Fill The Form</h2>

</li>

<li>
     <label for="firstname">First Name</label>
      <input name="firstname" id="keyword" type="text" placeholder="type first name (required)" required />
      <datalist id="results">
	
</datalist>
</li>

这是javascript代码

var MIN_LENGTH = 1;

$( document ).ready(function() {
	$("#keyword").keyup(function() {
		var keyword = $("#keyword").val();
		if (keyword.length >= MIN_LENGTH) {
			$.get( "auto-complete.php", { keyword: keyword } )
			.done(function( data ) {
				$('#results').html('');
				var results = jQuery.parseJSON(data);
				$(results).each(function(key, value) {
					$("datalist").empty();
                                        $("datalist").html(data);
				})

			    $('.item').click(function() {
			    	var text = $(this).html();
			    	$('#keyword').val(text);
			    })

			});
		} else {
			$('#results').html('');
		}
	});

    $("#keyword").blur(function(){
    		$("#results").fadeOut(500);
    	})
        .focus(function() {		
    	    $("#results").show();
    	});

});

php代码如下

  <?php
  require('constant.php');
   require('database.php');

  if (!isset($_GET['keyword'])) {
      die();
    }

  $keyword = $_GET['keyword'];
  $data = searchForKeyword($keyword);
  echo json_encode($data);
  ?>

请给点建议

【问题讨论】：

你试过$("#datalist").html(data); 吗？要使用 jQuery 选择元素，应该使用 #。
刚试了没用
对不起，我以为你发了$("results")...。在这种情况下，您应该使用#。
您是否尝试在 get 函数中将 dataType 设置为 json？
是的，我使用 jQuery 将数据传递为 json 格式

标签： javascript php jquery json html

【解决方案1】：

看起来您的 $.each 将清空每个结果的数据集。

试试这个吧。

$("datalist").empty();
$(results).each(function(key, value) {
   $("datalist").append($("<option>").innerHTML(data));
    })

您将创建一个新的 option 元素并将其附加到 datalist 元素。

【讨论】：