javascript - Jquery：弹出选择div的最佳方式

Question

问候，

假设我有这样的隐藏 div：

<div id="option-dialog" style="display:none;">
<a href="#" value="1">First</a>
<a href="#" value"2">Second</a>
</div>

我有一个文本输入字段：

<input type="text" id="myinput" />

当用鼠标单击 myinput 字段时，我希望隐藏的 div 显示在所选输入字段附近，一旦用户从该 div 中选择一个链接，div 就会消失，并且选择的值将成为文本输入字段的值。如何做到这一点？

我使用 jquery 和 jquery ui

问候

Answer 1

您可以使用Cluetip来执行此操作。

Answer 2

你考虑过使用JQueryUI: Autocomplete吗？这正是您正在寻找的

Answer 3

嗨，这可能是您需要的吗？

$（函数（）{
$("#myinput").click(function(){
$(this).hide('slow');
$('#option-dialog').show('slow');

});

$('#option-dialog a').click(function(){
var a = $(this).text();
$(this).parent().hide('slow');
$("#myinput").val(a).show('slow');
});




});
 


<div id="option-dialog" style="display:none;">
<a href="#" value="1">第一</a>
<a href="#" value"2">第二</a>
</div>
<input type="text" id="myinput" />

Answer 4

$("#myinput").live("focus", function() {
$("#option-dialog").toggle();
});

$(".option").live("click", function() {
var opt_val = $(this).attr("value");
$("#myinput").val(opt_val);
$("#option-dialog").toggle();

});

将 class="option" 添加到您的列表项