使用Javascript在TEXTAREA中隐式折叠

我希望能够使用Javascript/jQuery在xhtml textarea中创建一种折叠类型。例如，假设下面的文字：使用Javascript在TEXTAREA中隐式折叠

ABC [123] DEF

我想有[123]减少[]当光标不在它 - 即对于光标|：

ABC [] DEF| 
AB|C [] DEF 
ABC [|123] DEF 
ABC [12|3] DEF

我想要的内容当然，当物品被折叠时（即当光标离开支架时），并在折叠时（光标进入支架）恢复。

我对此非常感兴趣。

谢谢。

Brian

来源

2010-07-01 Brian M. Hunt

为了让你st艺术，阅读本SO线程：http://stackoverflow.com/questions/263743/how-to-get-cursor-position-in-textarea – Pointy 2010-07-01 13:50:28

只是一个说明，如果你想做mouseover，不幸的是，这种做法不会工作。它涉及只在点击时（或打字时）移动的插入符的位置。 – 2010-07-01 13:52:49

尖尖的：这是一个体面的起点。我最近用一个解决方案来解决类似的问题，在textarea中获取光标位置，该位置适合在IE中使用换行符，这是我在其他任何地方都看不到的地方：http://stackoverflow.com/questions/3053542/how-开始和结束点选择在文本区域/ 3053640＃3053640 – 2010-07-01 14:05:06

您可能想看看一些用JavaScript实现的Rich Text Editors。如果您将折叠视为内联样式的事物（css display：none;}，我相信您可以在其语法突出显示中添加一条规则，以便在无需太多努力的情况下使折叠工作。

10 jQuery and non-jQuery RTEs

你也可以看看Mozilla的Bespin的项目（http://mozillalabs.com/bespin/）。不能发布更多的链接，小新SO。

来源

2010-08-26 21:30:28

$(function(){ 
    //Format on load 
    $(".folding").html('[]'); 

    //Wire up load 
    $(".folding").mouseover(function(){ 
    $(this).html('[' + $(this).attr("original") + ']'); 
    }).mouseout(function(){ 
    $(this).html('[]'); 
    });     
}); 


<BODY>ABC <span class="folding" original='123'>[123]</span> DEF</BODY>

这应该为你工作。不是最有说服力的，但提供所需结果

来源

2010-08-28 00:03:07 jaredmroberts

感谢您的想法。虽然这可以折叠* span **的* mousover *。尽管如此，这并不能解决* textarea **问题中的* caret *问题。 – 2010-08-29 20:33:57

使用Javascript在TEXTAREA中隐式折叠

回答

相关问题