JavaScript 한 줄 코드,유동 단축 메시지 쉽게 해결-V2 업그레이드 버 전

그저께 밤 을 꼬박 새 워 서[단축 메시지 기능]를 발 표 했 습 니 다.그리고 V 1.0 베타 버 전의 단축 댓 글 기능 과 소스 코드 를 발 표 했 습 니 다.베타 버 전인 이 유 는 그 당시 에 기본 적 인 기능 이 있 지만 완선 되 지 않 고 특성 도 합 리 적 이지 않다 고 느 꼈 기 때 문 입 니 다.오늘 은 저도 모 르 게 이 럴 때 가 되 었 습 니 다.이번 에는 이전 버 전에 대해 많이 개선 되 었 습 니 다.우선,원래 댓 글 정 보 를 자동 으로 제출 하 는 동시에 자동 으로 추천 합 니 다.대량의 추천 수 는 블 로그 원 의 추천 순위 체제 에 직접적인 영향 을 주 었 기 때문에 나중에 첫 번 째 시간 에 추천 할 지 여 부 를 묻 는 상호작용 모델 로 수정 되 었 습 니 다!그 다음으로 단축 기능 이 있 고 사용 하기 좋 지만 화면 에 가득 찬'잘 붙 어!"대신 해 줄 게!"또한 심미 적 피로 가 있 고 실제 적 인 의미 가 없 기 때문에 댓 글 은 상호작용 을 해 야 가치 가 있 습 니 다.그래서 V2 라 는 판 은 상호작용 모델 에 중심 을 두 고 원래 의 형식 을 개선 하 는 데 중심 을 두 었 습 니 다.새 판 단축 댓 글 은 블 로그 원 에 있 는 원래 의 댓 글 상자 와 추천 을 모두 떠 서 화면 오른쪽 에 수직 으로 가운데 에 있 는 위 치 를 나타 내 는 것 과 같 습 니 다.사용자 가 편리 하 게 댓 글 을 달 수 있 도록 하 는 것 이 목적 이다.마지막 으로 새로운 단축 댓 글 기능 은 이전 버 전의 사용자 에 게 투명 한 업 그 레이 드 를 완전히 지원 합 니 다.즉,원래 이전 버 전 을 사용 한 사용자 가 현재 자신의 블 로그 에서 본 것 은 이미 최신 버 전의 인터페이스 와 기능 일 것 입 니 다!여기 서 jMsg 의 사용 방법 을 다시 한 번 말씀 드 리 겠 습 니 다.예전 과 똑 같 습 니 다.사실은 용법 이 정말 간단 합 니 다.[백 스테이지 관리]->[설정]->[페이지 첫 Html 코드]의 텍스트 상자 에 아래 의 이 말 을 채 우 면 됩 니 다.

 
//  [    ]->[  ]->[  Html  ]      
<script language="javascript" type="text/javascript" src="http://files.cnblogs.com/justinw/jMsg.js"></script> 

구체 적 으로 다음 그림 과 같 습 니 다.새 jMsg 의 구체 적 인 기능 디 테 일 은 위의 그림 에서 상세 하 게 설명 되 었 으 니 서술 하지 않 겠 습 니 다.다음은 새 버 전의 소스 코드 입 니 다.마찬가지 로 많은 기능 특성 이 보완 되 어야 합 니 다.예 를 들 어 인터페이스 효 과 는 다시 미화 할 수 있 습 니 다.지금 은 가장 심 플 한 스타일 만 제공 하고 코드 든 기능 디자인 이 든 모두 비판 과 지적 을 환영 합 니 다.코드 의 조직 형식 은 이전 판 과 크게 바 뀌 었 고 이전 판 의 소스 코드 는 여기 서 얻 을 수 있 습 니 다.새 버 전의 소스 코드 는 다음 과 같 습 니 다.

 
//  ：Justin 
//  ：http://justinw.cnblogs.com/ 
//  ：         。 
//  ：V2.0 
//    ：201004020037 
//  ：    ，      http://www.cnblogs.com/justinw/archive/2010/03/30/1700190.html     。 
//  ： 
//1.v2 V1beta          ，                。 

//--begin--jMsg--- 
jMsg = function() { 
var chkRecomend = false; 
} 

jMsg.prototype = { 
//      
initialize: function() { 
jMsg.loadEvent(this.combat); 
this.msgDIV(); 
}, 
dispose: function() { 
//todoSomething... 
}, 
//       
post: function(msg) { 
//      HaveUp   ，           。 
if (window.top.HaveUp) { 
alert('      ！     ：）'); 
return false; 
} 
if (msg.trim().length == 0) { 
alert('         ！'); 
return false; 
} 
else if (msg.trim().length > 1000) { 
alert('    ，        1000   ！'); 
return false; 
} 

var txt = document.getElementById('tbCommentBody'); 
if (txt != null) { 
txt.style.backgroundColor = "#E4F5FF"; 
var date = new Date(); 
txt.value = msg; 
txt.focus(); 
//           ，HaveUp    true 
//        ，HaveUp      。 
window.top.HaveUp = true; 
//             ，          。 
//                   ，      。(       ，    ) 
var rlt = PostComment(); 
this.setMsgText(""); 
return true; 
} 
else { 
//                     。 
//     tbCommentBody  ，            。 
alert("               ！"); 
return false; 
} 
}, 
//   
recommend: function() { 
var diggit = jMsg.getElementsByClassName('diggit'); 
if ((diggit) && (diggit[0])) { 
diggit[0].onclick(); 
} 
else { 
alert("Debug:     ClassName   ！"); 
} 
}, 
//   
combat: function() { 
var buryitMsg = function() { 
//                ，             。 
//               ，          。 
var txt = document.getElementById('tbCommentBody'); 
if (txt != null) { 
alert('    ，             ，   ...'); 
txt.style.backgroundColor = "#fe9ab3"; 
txt.focus(); 
} 
} 
var buryit = jMsg.getElementsByClassName('buryit'); 
if ((buryit) && (buryit[0])) { 
jMsg.addEvent(buryit[0], "click", buryitMsg); 
} 
}, 
//          
superPost: function(msg) { 
if (this.post(msg)) { 
//        ，          
if (this.chkRecomend) { 
this.recommend(); 
} 
else { 
if (confirm("             ？")) { 
this.recommend(); 
} 
} 
} 
}, 
//           
msgDIV: function() { 
//       。 
if (!(window.location.href.indexOf(".html") > -1)) return; 

//             
lastScrollY = 0; 
var beat = function() { 
var diffY; 
if (document.documentElement && document.documentElement.scrollTop) 
diffY = document.documentElement.scrollTop; 
else if (document.body) 
diffY = document.body.scrollTop 
else 
{ /*Netscape stuff*/ } 

percent = .1 * (diffY - lastScrollY); 
if (percent > 0) percent = Math.ceil(percent); 
else percent = Math.floor(percent); 
document.getElementById("msgDiv").style.top = parseInt(document.getElementById("msgDiv").style.top) + percent + "px"; 

lastScrollY = lastScrollY + percent; 
} 

document.write(this.getMsgBoxHTML()); 

window.setInterval(beat, 120); 
}, 
getMsgBoxHTML: function() { 
var _HTML = ""; 
_HTML += "<div id=\"msgDiv\" style=\"width:265px;z-index:2010; right:15px; top:400px; position:absolute;\">"; 
_HTML += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">"; 
_HTML += "<tbody>"; 
_HTML += "<tr><td colspan=\"2\"><textarea id=\"jmsg\" title=\"      ，    ！\" style=\"border-color:navy;background-color:transparent;width:265px;height:100px\">    ，  ！</textarea></td></tr>"; 
_HTML += "<tr><td style=\"width:200px\"><input title=\"Alt+Enter\" name=\"postjMsg\" type=\"submit\"onclick=\"$jMsg.superPost($jMsg.getMsgText());return false;\" value=\"  \" style=\"width:80px\"/>"; 
_HTML += " <a id =\"passBy\" onclick=\"$jMsg.setMsgText('  ...');return false;\" href=\"###\">  </a> "; 
_HTML += "<input name=\"chkjMsg\" type=\"checkbox\" onclick=\"$jMsg.setChkRecomend(this.checked);\"/>  </td><td style=\"font-size:small;text-align:right;vertical-align:top\">2010©<a href=\"http://justinw.cnblogs.com\" target=\"_blank\">Justin</a></td></tr>"; 
_HTML += "</tbody></table>"; 
_HTML += "</div>"; 
return _HTML; 
}, 
setMsgText: function(txt) { 
var area = document.getElementById("jmsg"); 
area.value = txt; 
}, 
getMsgText: function() { 
var area = document.getElementById("jmsg"); 
return area.value; 
}, 
setChkRecomend: function(val) { 
this.chkRecomend = val; 
} 
} 

//  onload   
jMsg.loadEvent = function(fn) { 
var oldonload = window.onload; 
if (typeof window.onload != 'function') { 
window.onload = fn; 
} else { 
window.onload = function() { 
oldonload(); 
fn(); 
} 
} 
} 

//     
jMsg.addEvent = function(obj, type, fn) { 
if (obj.addEventListener) 
obj.addEventListener(type, fn, true); 
else if (obj.attachEvent) { 
obj.attachEvent("on" + type, function() { 
fn(); 
}); 
} 
} 

//  ClassName  DOM   
jMsg.getElementsByClassName = function(n) { 
var el = [], 
_el = document.getElementsByTagName('*'); 
for (var i = 0; i < _el.length; i++) { 
if (_el[i].className == n) { 
el[el.length] = _el[i]; 
} 
} 
return el; 
} 

String.prototype.trim = function() { 
return this.replace(/(^\s*)|(\s*$)/g, ""); 
} 

//--end--jMsg--- 
//todo:               
//todo:                
//todo:              
var $jMsg = new jMsg(); 
$jMsg.initialize(); 

작성 자:Justin 출처:http://justinw.cnblogs.com/