@ivrtikshoret
אם אתה רוצה פיתרון קל, תחליף את הtextarea ב-contenteditable, ואז תוכל לקרוא את המיקום שלו ישירות בJS, ואז אתה עושה משהו כזה:
.autocomplete({
open: function( event, ui ) {
var input = $( event.target ),
widget = input.autocomplete( "widget" ),
style = $.extend( input.css( [
"font",
"border-left",
"padding-left"
] ), {
position: "absolute",
visibility: "hidden",
"padding-right": 0,
"border-right": 0,
"white-space": "pre"
} );
var pos = { at: {x: 0, y: 0}};
input.autocomplete( "option", "position", pos );
widget.position( $.extend( { of: input }, pos ) );
},
אם אתה רוצה פיתרון קשה - אז האפשרויות הן יצירה של CANVAS ולחשב עליו את הoffset(פחות מומלץ) או DIV ולשים אותם מחוץ למסך (position absolute), ואז לעצב אותם בדיוק כמו הtextarea, ואז להעתיק לשם עד הטקסט שנמצא ה-caret, ולמקם בסוף הטקסט איזשהו DIV נוסף ולקחת את הOFFSET שלו ביחס לאב, ואז לעשות שוב את התהליך שמתואר לעיל.
עריכה:
אתה יכול לנסות למקם contenteditable בדיוק במיקום של הtextarea ו-OPACITY 0, וכל הזמן לסנכרן אותם.
נ.ב. אני לא בטוח שjquery ui autocomplete עובד עם contenteditable
עריכה ל-נ.ב.
https://stackoverflow.com/questions/13324822/autocomplete-with-contenteditable-div-instead-of-textarea-doesnt-seem-to-work