J.chong

html,body,h1,h2,h3,h4,h5,h6,hr,p,iframe,dl,dd,ul,ol,li,pre,form,fieldset,button,input,textarea,th,td{margin: 0;padding: 0}
html{background-color: #FFF}
body,button,input,select,textarea,fieldset,label{font: 12px/1.5 "Lucida Grande",tahoma,arial,\5b8b\4f53;-ms-overflow-style:scrollbar}
h1,h2,h3,h4,h5,h6{font-size: 100%}
ul,ol,menu{list-style: none}
fieldset,img{border: 0 none}
img{-ms-interpolation-mode: bicubic}
img,input,textarea,button,select{vertical-align:middle}
i,em,optgroup,address,cite{font-style: normal}
table{border-collapse: collapse;border-spacing: 0}
caption,th{text-align:inherit}
input,select,textarea,button{font-size: 100%;-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box}
article,aside,footer,header,section,nav,figure,figcaption,hgroup,details,menu{display:block}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
input,textarea,button,select,a{outline:0 none}
button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}
button,input[type=button],input[type=submit]{cursor: pointer}
button[disabled],html input[disabled]{cursor:default}
input[type=search]{-webkit-appearance: textfield}
textarea{overflow-y: auto;resize: vertical}
sup,sub{vertical-align:baseline}
a{color: #333;text-decoration: none}
a:hover{text-decoration: underline}
.clearfix{zoom: 1}
.clearfix:after{content: ' ';display: block;clear: both;height: 0;visibility: hidden}

精簡版

html,body,h1,h2,h3,h4,h5,h6,hr,p,iframe,dl,dd,ul,ol,li,pre,form,fieldset,button,input,textarea,th,td{margin: 0;padding: 0}
body,button,input,select,textarea,fieldset,label{font: 12px/1.5 "Lucida Grande",tahoma,arial,\5b8b\4f53;}
h1,h2,h3,h4,h5,h6{font-size: 100%}
ul,ol{list-style: none}
fieldset,img{border: 0 none}
img,input,textarea,button,select{vertical-align:middle}
i,em{font-style: normal}
table{border-collapse: collapse;border-spacing: 0}
caption,th{text-align:inherit}
input,select,textarea,button{font-size: 100%;outline:0 none}
button,input[type=button],input[type=submit]{cursor: pointer}
textarea{overflow-y: auto;resize: vertical}
sup,sub{vertical-align:baseline}
a:hover{text-decoration: underline}
.clearfix{zoom: 1}
.clearfix:after{content: ' ';display: block;clear: both;height: 0;visibility: hidden}

選中文字方法

    function selectText() {
        if (document.selection) { //IE
            return document.selection.createRange().text;//字符串
        }
        else {
            return window.getSelection().toString(); //getSelection()對象，需轉成字符串
        }
    }

阻止冒泡方法

function (ev) {
    ev = ev || event
    if(ev.stopPropagation){
        ev.stopPropagation();
    }
    else{
        ev.cancelBubble = true;
    }
}

完整例子

window.onload = function () {
    //選中文字方法
    function selectText() {
        if (document.selection) { //IE
            return document.selection.createRange().text;//字符串
        }
        else {
            return window.getSelection().toString(); //getSelection()對象，需轉成字符串
        }
    }

    var p = document.getElementById('p1')
    var img = document.getElementById('img')
    p.onmouseup = function (ev) {
        var ev = ev || event
        var left = ev.clientX;
        var top = ev.clientY;
        ev.stopPropagation()
        if (selectText().length > 10) {
            setTimeout(function () {  //延遲觸發
                img.style.display = 'block'
                img.style.left = left + 'px'
                img.style.top = top + 'px'
            }, 100)
        }
        else {
            img.style.display = ''
        }
    }
    p.onclick = function (ev) {
        var ev = ev || event;
        ev.cancelBubble = true
        /*if(ev.stopPropagation){
         ev.stopPropagation()
         }
         else{
         ev.cancelBubble = true;
         } //低版本可能需要兼容*/
    }
    document.onclick = function () {
        img.style.display = ''
    }
    img.onclick = function () {
        window.location.href = 'http://service.weibo.com/share/share.php?searchPic=false&title=' + selectText() + '&url=' + window.location.href;
    }
}

運行