單擊單詞時AJAX選項框？

這可能嗎？像我有一個文本框，這句話：單擊單詞時AJAX選項框？

「我回家了」

然後當我點擊「家」的選項框顯示出來，如：

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

對不起我醜的方式來表明它，想不到任何更好的笑lol

來源

2011-07-20 André Cardoso

<!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>

你需要一份j查詢（或指向Google的CDN），以使其發揮作用。這個例子很原始，但希望它能讓你走到你想去的地方。

來源

2011-07-20 21:45:36

單擊單詞時AJAX選項框？

回答

相關問題