Question

这可能吗？就像我在文本框上有这个短语一样：

“我回家了”

然后当我点击“主页”时，一个选项框显示如下：

"I entered home"
         |garden|
         | motel|
         |______|

对不起我丑陋的表现方式，想不出更好的事情lol

Answer 1

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
    $("#fieldName").focus(function(){
        var el = $(this);
        var coords = el.offset();
        var div = $("<div>").addClass("dropdown").html("<span>garden</span><span>motel</span>").css({"top":coords.top+18+"px","left":coords.left+45+"px"});
        el.after(div);
        $(".dropdown span").click(function(){
            var newText = "I entered the " + $(this).text();
            $("#fieldName").val(newText);
            $("div.dropdown").remove();
        });
    });
});
</script>
<style>
    .text {width:120px;}
    .dropdown {width:75px; text-align:right; position:absolute; padding:2px; background:#eee; border:1px solid #aaa;}
    .dropdown span {display:block; cursor:pointer;}
</style>
</head>
<body>
<input type="text" class="text" name="fieldName" id="fieldName" value="I entered the home" />
</body>
</html>

您需要一份jquery（或指向Google的CDN）来实现此目的。这个例子很原始，但希望它能让你到达你想去的地方。

单击一个单词时的AJAX选项框？

1 个答案: