4

我正在寻找一种方法来保存和加载 web 应用程序的 textarea 中的插入符号位置，以便当用户重新打开 web 应用程序时，它们会自动回到他们离开的位置。

我已经看到了jQuery 的jCaret插件，但是由于我的 Web 应用程序不使用 jQuery，我需要在纯 JavaScript 中工作的东西。

另外，启动函数以保存插入符号位置的最佳方法是什么？想到的第一个方法是在每次按键时重新保存它，但这似乎有点低效。我一直在考虑让应用程序通过 onBeforeUnload 事件保存位置，但如果您能想到更好的方法，请分享！

4

2 回答 2

2

通过一些小的修改，您可以在没有jQuery 的情况下使用 jCaret。我查看了 jCaret 源代码，它使用 jQuery 完成所有两件事：使用 jQuery 选择器提供元素，以及测试浏览器是否为 IE。摆脱这些，你就上路了。

更详细的说明：

  1. 下载 jCaret 的未压缩源：http ://examplet.buss.hk/download/download.php?plugin=caret.1.02
  2. 添加var caret;到顶部。
  3. $,从_(function($,len,createRange,duplicate){
  4. $.fn.从中删除$.fn.caret=function(options,opt2){
  5. 更改var start,end,t=this[0],browser=$.browser.msie;为var start,end,t=this[0],browser=/(msie) ([\w.]+)/.test(navigator.userAgent);
  6. 在最后一行，jQuery,从})(jQuery,"length","createRange","duplicate");

要使用它，您需要执行以下操作：

caret.call([document.getElementById("myText")], options, opt2);
于 2010-12-13T04:18:41.200 回答
2

经过进一步研究，我得出了一个使用 HTML5 localStorage 的简单解决方案。

这是我为保存插入符号位置而编写的脚本：

function caretPositionSave() { 
    window.localStorage.setItem("CaretPosition", document.querySelector("#editor").selectionStart);
};

And another one for loading it:

function caretPositionLoad() {
    document.querySelector("#editor").focus();
    if (localStorage.CaretPosition) {
        document.querySelector("#editor").selectionStart = localStorage.CaretPosition;
    };
};

These, combined with similar functions to set the screen's scroll position, seem to do the trick perfectly!

于 2010-12-13T07:38:06.127 回答