<分区>
<分区>
我使用 jquery 创建了一个带有自动建议的搜索框。问题是我的列表像往常一样从上到下打开。我怎样才能让它朝相反的方向打开，从下到上？
这是 html 代码:
<input name="search" type="text" id="search_form_1" size="65" placeholder=" Search..."/>
<input type="submit" value="" name="submit" />
这是我的 CSS:
#search_result{
padding:0px;
box-shadow: 0 0 5px rgba(210, 210, 210, 210);
background:#333;
color:white;
position:absolute;
cursor:pointer;
}
#search_form_1{
float: left;
padding-top:6px;
padding-left: 0px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px; color:#333;
}
这是我的 Jquery 代码:
$(document).ready(function(){
var left = $('#search_form_1').position().left;
var top = $('#search_form_1').position().top;
var width = $('#search_form_1').width();
$('#search_result').css('left', left+4).css('top', top-50).css('width',width);
$('#search_form_1').keyup(function(){
var value = $(this).val();
if(value != ''){
$.post('search_form.php', {value: value}, function(data){
$('#search_result').html(data);
});
}
});
});
最后这是我的 php 代码，它调用并显示列表中的名称:
<?php
$value = $_POST['value'];
$query = mysql_query("SELECT `surname` FROM `users` WHERE `surname` LIKE '$value%' ");
while($run = mysql_fetch_array($query)){
$surname = $run['surname'];
echo "$surname";
}
?>
最佳答案
尝试使用 jQuery 位置实用程序，例如，
$(function() {
function position() {
$( ".positionable" ).position({
of: $( "#parent" ),
my: $( "#my_horizontal" ).val() + " " + $( "#my_vertical" ).val(),
at: $( "#at_horizontal" ).val() + " " + $( "#at_vertical" ).val(),
collision: $( "#collision_horizontal" ).val() + " " + $( "#collision_vertical" ).val()
});
}
这里my是子元素，at是父元素
关于php - jquery 使搜索自动建议列表从下到上打开(相反方向)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17352867/