iWork的评论能力，这是可能实现使用jQuery
https://stackoverflow.com/questions/2246874
-
20-09-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian题
iWork的具有突出显示文本，然后标记该文本注释的能力。注释然后用一条线来突出显示的文本链接。
我很好奇，如果这样的事情可能在jQuery中实现。有什么困惑我的是： A.如何画线，并有当用户改变文本将其更新 B.如何突出显示文本，并把它以某种方式标记？
编号喜欢听到的，如果这是即使有jQuery和任何意见或插件可以点我在正确的方向你的看法。
解决方案
是，这不是很难完成。
首先 - 你需要得到select事件
在选择事件发送到当用户在其内部文本选择的元素。此事件被限制为字段和框。
例如，考虑HTML：
<form>
<input id="target" type="text" value="Hello there" />
</form>
<div id="other">
Trigger the handler
</div>
事件处理程序可以被绑定到文本输入：
$('#target').select(function() {
alert('Handler for .select() called.');
});
请参阅： http://api.jquery.com/select/
二 - 你需要创建一个标签
CSS
<style>
body{font-size:12px; font-family:"Trebuchet MS";}
#content1{
border:1px solid #CCCC33;
padding:10px;
margin-top:10px;
width:500px;
}
</style>
(X)HTML
<a href="#" id="click">Something Here</a>
<div class="box">
<div id="content1">
<p><a href="#" id="close">Close</a></p>
</div>
</div>
</body>
正如你可以看到它是一个很简单的例子，但利用这一点，只是无限！
现在对jQuery代码做所有时髦的东西。我所要做的就是显示和隐藏内容1 Div元素。对于我创建下面的jQuery代码，看看那么我将通过它。
$(document).ready(function(){
$('#content1').hide();
$('a').click(function(){
$('#content1').show('slow');
});
$('a#close').click(function(){
$('#content1').hide('slow');
})
});
正如我所提到早些时候$（文件）。就绪（函数（）}是等待，直到页准备好执行它里面的代码之前被操纵的功能。
下一行$（ '＃内容1'）隐藏（）;隐藏内容1事业部开始。请注意如何有jQuery和CSS之间的关系中是使用，ID是这种情况下，但也可能以完全相同的方式使用的一类，因为括号内的自变量。
然后我们进入下一个代码部分，其“显示”的DIV被点击链接的文本时。 $（'一个）。单击（函数（）{}）;这是调用“点击”功能，然后调用在内容1股利“显示”的效果。
再次阅读代码，并确保你的逻辑一握。我花了一些时间来得到它的窍门以及！
内正被示出和隐藏存在另一个将隐藏在div文本链接本部
$('a#close').click(function(){
$('#content1').hide('slow');
})
如果你看这个你可以看到，任何“一个”（链接）与的ID元件“关闭”将调用在内容1股利“隐藏”效果。
请参阅： http://dreamweaverspot.com/jquery-show-和隐藏-A-DIV /
三 - 画出你行
下载插件jQuery的SVG - http://jquery.com/plugins/project/svg
绘图订单
$("#example1").drawLine(0, 0, 220, 45);
请参阅： http://www.openstudio.fr/Library - 用于-简单拉-with.html
就是这样。只要把它放在一起，以得到它，你怎么想的那样。
其他提示
也许作为提示简单的东西可能是你的答案。我已经使用了的 qtip 的插件，在过去，它有你要找的影响。
看看网站：
http://craigsworks.com/projects/qtip/
使用qtip将很好地工作，用于保持文档上方浮起的信息。
关于选择所述文档中的文本的某些部分，托德具有最好的方法有，我也发现这个问题SO：
一旦选择我将与一个id它包装在一个跨度，并使用qtip 尖为线（指向所讨论的跨度）的文本。这可以在运行中的风格，并制成任何尺寸，如下所述：
http://craigsworks.com/projects/qtip/docs/tutorials/ #tips
这是使用qtip插件一种有趣的方式，我希望一些这方面的信息，帮助你。
马库斯。
托德已经基本概述你需要在这里除了写你的应用程序要做的事情。你需要在内存中有两个列表;评论一个和标签之一，办法在DOM（唯一ID）两个相关联。我建议检查出如何的元素相对于窗口滚动位置移动类似的帖子。你需要确定哪些标签是在任何给定时间可见的一些方法，我怀疑你可以做到这一点的标准的jQuery位置的功能之一;同样需要用于绘制两个元件之间的线。一个简单的搜索产生 http://api.jquery.com/position/ 。一旦你确定哪些标签是可见的，你可以重新填充适当的评论意见UI元素，找到自己的位置，并从标记元素comment元素画一条线。如果您需要能够也能修改的意见，和你期待他们没有一个窗体保存提交，你将需要一个数据库和一个Ajax调用一旦你完成编辑坚持的意见。
如果你是在谈论一个文本输入字段，它要困难得多，我不认为你可以用任何标准输入元素做很容易。我想看看富文本编辑器中的一个，在那里，可能会暴露一些这方面的功能（YUI？），并与您的插件结合起来。
