作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试开发一项功能,该功能可以根据数据库中已有的内容提出建议,或者允许您输入自己的值。这是一种让用户知道系统中已有内容的方法,以防他们想要对某些内容进行类似的分类。所以我就这么做了。
问题是下面的代码提供了一个下拉菜单,我无法弄清楚要在谷歌中搜索哪些单词才能获得有关您键入的内联完成类型的教程,它会填充单词的其余部分:您直接在框中输入,无需下拉。
有人有什么建议吗?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Auto Complete Input box</title>
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>
<script>
$(document).ready
(function()
{
$("#tag").keyup
(function()
{
var tag= $(this).val();
if(tag!='')
{
$.ajax(
{
type: "GET",
url: "autocomplete.php",
data: "q=" + tag,
cache: true,
success: function(result)
{
$("#tag").val(result);
}
}
);
}
return false;
}
);
}
);
</script>
</head>
<body>
<form method="post" action="input.php">
Please put something in: <input name="tag" type="text" id="tag" size="20">
<input type="submit" value="Submit">
</form>
<?php
$mysqli=mysqli_connect('localhost','XXXXXXXXXX','XXXXXXXX','XXXXXXXXXXX') or die("Database Error");
$sql="SELECT auto_complete_suggestions FROM auto_complete";
$result = mysqli_query($mysqli,$sql) or die(mysqli_error());
?>
</body>
</html>
与本文相关
<?php
$q=$_GET['q'];
$my_data=mysql_real_escape_string($q);
$mysqli=mysqli_connect('localhost','XXXXXXXXX','XXXXXXXXXX','XXXXXXXXXX') or die("Database Error");
$sql = "SELECT DISTINCT auto_complete_suggestions FROM auto_complete WHERE auto_complete_suggestions LIKE '%$my_data%'
ORDER BY CASE WHEN auto_complete_suggestions = '$mydata' THEN 0
WHEN auto_complete_suggestions LIKE '$mydata%' THEN 1
WHEN auto_complete_suggestions LIKE '%$mydata%' THEN 2
WHEN auto_complete_suggestions LIKE '%$mydata' THEN 3
ELSE 4
END, auto_complete_suggestions LIMIT 0,1";
$result = mysqli_query($mysqli,$sql) or die(mysqli_error());
if($result)
{
while($row=mysqli_fetch_array($result))
{
echo $row['auto_complete_suggestions']."\n";
}
}
?>
我假设这将是一个 AJAX 或 JQuery 任务,但我没有找到任何示例,因此任何为我指明正确方向的帮助将不胜感激。
简而言之:希望构建一个功能,在我键入时完成文本并直接在文本框中提供建议。
谢谢!
最佳答案
如果我理解正确的话,您会希望将数据库中的建议放入“标签”文本框中。如果是这种情况,您可以按照以下方式做一些事情:
$(document).ready(function(){
$("#tag").keyup(function()
{
var tag= $(this).val();
if(tag!='')
{
$.ajax({
type: "GET",
url: "autocomplete.php",
data: "q=" + tag,
cache: false,
success: function(result)
{
$("#tag").val(result);
}
});
}return false;
});
});
尽管您必须将结果限制为一条记录。
在你的 autocomplete.php 中(我假设这是第二个代码片段)你会这样做:
$sql="SELECT DISTINCT auto_complete_suggestions FROM auto_complete WHERE auto_complete_suggestions LIKE '%$my_data%' ORDER BY auto_complete_suggestions LIMIT 0,1";
一旦 keyup 事件触发,这将进行 AJAX 调用,并使用标签文本框的值进行搜索。
关于jquery - 当您键入时,文本字段自动完成(在字段中),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26631265/
我是一名优秀的程序员,十分优秀!