Javascript 防止Safari在单击按钮时丢失正文中的选定文本

我有一个应用程序，当单击父窗口中的“说出来”按钮时，它会将任何选定的正文文本传递给text-2-speech服务器（通过ajax）；所选文本位于iframe中

该选项适用于Firefox 3.6和IE 8，但不适用于Safari 5（还没有尝试过其他浏览器；这是我们支持的浏览器列表）。在Safari中，每当单击执行该功能的按钮时，所有选定的文本都会丢失

我已尝试将此项添加到演示文稿iframe的鼠标悬停中，作为控件中丢失选定文本的解决方案，但它不适用于文档正文中的选定文本：

$("#the_presentation").mouseup(function(e){

  e.preventDefault();

});

捕获所选文本的功能如下：

function getSelectedText(){
//Grab selected text
var _txt = '';
var _selection = null;

if(window.getSelection){
  _txt = window.getSelection().toString();
}
else if(document.getSelection){ //deprecated in ff
  _txt = document.getSelection()+'';
}
else if(document.selection){
  _selection = document.selection.createRange();
  if(_selection != null && _selection.text )
  {
    _txt = _selection.text;
  }
}

  return _txt;
}

感谢您提供的任何见解

---

*编辑：我忘了提到只发生在Mac safari上-windows safari没有问题。

为什么不在文本选择发生任何更改时调用

getSelectedText（）

，并将其存储到单击按钮为止

在jQuery中，这将类似于以下内容：

$(function(){
    var currentSelectedText = '';

    $(document.body).bind('keyup mouseup mousedown', function(){
        currentSelectedText = getSelectedText(); //your function from above
    });

    $('#the_form').submit(function(){
        makeAjaxCallForSpeech(currentSelectedText);
    });
});

（注意：根据您的问题，我不确定iFrame发生了什么。因此，此解决方案不涉及您提到的iFrame设置。您必须根据您的特定需要采用它。）

如果您使用的是

按钮类型的

元素，尝试使其不可选择，以防止在单击时破坏所选内容。你可以在大多数浏览器中使用CSS并在IE中使用

unselectable

属性来实现这一点。我不知道下面的方法是否有效，因为我手头没有Mac上的Safari

<style type="text/css">
*.unselectable {
   -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   user-select: none;
}
</style>

<input type="button" class="unselectable" unselectable="on" 
    onclick="alert(getSelectedText())">

*.不可选择{
-moz用户选择：无；
-khtml用户选择：无；
-webkit用户选择：无；
用户选择：无；
}

好主意！我不喜欢这样做，感觉有点像黑客，但它有效，不会破坏任何其他行为。。。谢谢这感觉像一个黑客，因为它是一个黑客：）谢谢，这是一个更干净的解决方案，但它没有工作-真的希望它会，因为mac safari选择在按钮点击后丢失，这对用户来说是一个剩余的烦恼。确定。我不是100%自信。我相信我以前已经做到了，所以我会玩一玩。