字数小书签

时间:2012-10-19 13:14:26

标签: javascript html5 dynamic bookmarklet

我正在尝试创建一个单词计数(对于任何页面)bookmarklet而不加载外部文件。简而言之,我想单击书签,然后能够在屏幕上拖动和选择文本,并获得包含所选单词数的警报。我已将它们放在一起以获得正确的功能,但在转换为bookmarklet时遇到了绊脚石:

<html>
<body onmouseup="countWords()">     
<article id="page1">
    <h1>Home 2</h1>
    <p>Welcome 2</p>
    <script type="text/javascript">
function countWords() {
var selectedText = document.activeElement;
var selection = selectedText.value.substring(selectedText.selectionStart, selectedText.selectionEnd);
words = selection.match(/[^\s]+/g).length;
if (words !== "") {
    alert(words);
}
}
</script>
    <div><textarea></textarea></div>
</article>
</body>
</html>

第一个问题:我可能正在咆哮错误的树但是我想将onmouseup附加到activeElement但是我不知道如何做到这一点。

第二个问题:我可以在不使用外部文件的情况下将其插入书签吗?

非常感谢任何帮助。

最佳,

Tamler

逃避角色......这就是问题所在。

这是一个有效的例子:

<a href="javascript:(document.onmouseup=function(){var selectedText=document.activeElement;var selection=selectedText.value.substring(selectedText.selectionStart,selectedText.selectionEnd);words=selection.match(/[^\s]+/g).length;if(words!==&quot;&quot;){alert(words)}})();" target="_blank">Word Count</a>

2 个答案:

答案 0 :(得分:1)

试试这个,看起来你的代码有点复杂:

alert(window.getSelection().toString().match(/\w+/g).length);

第一部分window.getSelection().toString()将获得实际选定的文字。最后一部分是匹配每个单词的基本正则表达式,然后计算匹配。您可以将正则表达式修改为或多或少,以满足您的需求。

这只会提醒已经选择的单词数量,如果您想在点击书签后进行选择,可以将上述内容包装在侦听窗口鼠标事件的函数中。

编辑:这是一个完整的示例书签:

<a href="javascript: _wcHandler = function() { var _wcSelection, _wcCount; ((_wcSelection = window.getSelection().toString().match(/[^\s]+/g)) && (_wcCount = _wcSelection.length) && (window.removeEventListener('mouseup', _wcHandler) || alert(_wcSelection.length))); }; window.addEventListener('mouseup', _wcHandler);">Word Count</a>

...并以可读格式书写:

_wcHandler = function() {
    var _wcSelection, _wcCount; 
    ((_wcSelection = window.getSelection().toString().match(/[^\s]+/g)) 
     && (_wcCount = _wcSelection.length) 
     && (window.removeEventListener('mouseup', _wcHandler) 
         || alert(_wcCount))); 
}; 
window.addEventListener('mouseup', _wcHandler);​

最后,jsFiddle让你修补:http://jsfiddle.net/Rr2KU/1/

答案 1 :(得分:1)

  

我可能正在咆哮错误的树,但我想将onmouseup附加到activeElement但是我不知道如何做到这一点。

将其附加到文档。 document.onmouseup = countWordsdocument.onmouseup = function(){...}

  

我可以在不使用外部文件的情况下将其插入书签吗?

是的:

javascript:document.onmouseup=function(){var selectedText=document.activeElement;var selection=selectedText.value.substring(selectedText.selectionStart,selectedText.selectionEnd);words=selection.match(/[^\s]+/g).length;if(words!==""){alert(words)}}

http://www.google.com/search?q=bookmarklet+generator

但我使用了:http://javascriptcompressor.com/