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

您好

假设我有这样一个隐藏的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和jQueryUI

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

您考虑过使用吗？ 这正是你想要的

$("#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”添加到您的列表项目中

嗨，这是您需要的吗

$(function() { $("#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">First</a> <a href="#" value"2">Second</a> </div> <input type="text" id="myinput" /> $（函数（）{ $（“#myinput”）。单击（函数（）{ $（this.hide（'slow'）； $（“#选项对话框”）.show（'slow'）； }); $（“#选项对话框a”）。单击（函数（）{ var a=$（this.text（）； $（this.parent（）.hide（'slow'）； $（“#myinput”）.val（a）.show（'slow'）； }); });