1

我正在尝试创建一个内联文本区域，其中用户单击一段文本并且文本区域替换它。

一切顺利，但是当我尝试在该区域中选择/突出显示文本时，它会显示 textarea。

我注意到在 Trello 上，它设法避免了这种情况。

我的HTML如下：

<h2>Your Notes</h2>
<span id="notes_area" style="display: block;" data-entry-id="<%= @entry.id %>" title="Click to edit your notes.">
    <p><%= @entry.notes.present? ? "#{@entry.notes}" : "You have not added any notes for this episode." %></p>
</span>

我的 CoffeeScript 如下（有很多删减）：

$("#notes_area").bind "mouseup", ->
    display_inline_note_form()

display_inline_note_form = ->
    # code goes here...

我想这是一个已解决的问题，但我似乎在网上找不到任何东西。

谢谢

4

1 回答 1

1

您可以在调用“display_inline_note_form()”之前检查用户是否选择了任何文本。

$("#notes_area").bind "mouseup", ->
    var selectedTxtRange = getSelectedText();
    if(selectedTxtRange.toString().length == 0)
        display_inline_note_form()

这是 getSelectedText() 定义，我从 CodeToad 得到这个代码片段，

function getSelectedText()
{
    var txt = '';

     if (window.getSelection)
    {
        txt = window.getSelection();
             }
    else if (document.getSelection)
    {
        txt = document.getSelection();
            }
    else if (document.selection)
    {
        txt = document.selection.createRange().text;
            }

      return txt;    
}
于 2012-04-20T17:37:17.263 回答