JS를 통해 컨텐츠를 클립 보드에 복사하려면 어렵지 않지만 브라우저의 호환성을 고려하면 jQuery-Zclip 사본을 사용하는 것이 좋습니다. . 원리를 자세히 설명하지 않겠습니다. 구현 방법에 대해 이야기합시다.
예를 들어, 내 HTML 코드는 다음과 같습니다.
코드 사본은 다음과 같습니다.
<div>
<code rel = "1"> <span id = "id_1"> coveried1 </span> </code>
<코드 rel = "2"> <span id = "id_2"> 복사 할 내용 </span> </code>
<코드 rel = "3"> <span id = "id_3"> coveried3 </span> </code>
</div>
총 2 개의 JS 파일이 있으므로 jQuery를 언급 할 필요가 없으며 jQuery-Zclip.js 및 Zeroclipboard.swf는 공식 웹 사이트에서 다운로드 할 수 있으며 주소는 다음과 같습니다. /www.steamdev.com/zclip /
복사 버튼을 생성하는 JS는 다음과 같습니다.
코드 사본은 다음과 같습니다.
<script type = "text/javaScript">
$ (function () {
$ ( 'code'). 각 (function () {
var self = $ (this);
var id = self.attr ( 'rel');
var copy = $ ( '<span> copy </span>'). 부록 (self) .zclip ({{
'path': '/static/admin/js/zeroclipboard.swf', // 여기에 나만의 주소를 작성하십시오
'애프터 코피': function () {
ALERT ( '해당 코드의 주소가 클립 보드에 복사되었습니다. Ctrl+V를 사용하여 붙여 넣을 수 있습니다.');
},
'사본': function () {
return $ ( '#id _'+id) .text (); // 여기에 참고, div span 등.
}
});
});
});
</스크립트>
이런 식으로 브라우저에서 시간을 복사 할 수 있습니다. 나중에 Flash가 생성되었지만 텍스트의 위치에 있지 않았습니다. 나는 많은 정보를 확인했고 어떤 사람들은 코드를 변경해야한다고 말했지만 변경했고 괜찮 았습니다.
수정 해야하는 코드는 다음과 같습니다.
코드 사본은 다음과 같습니다.
getDomobjection : function (obj, stopobj) {
// dom 요소에 대한 절대 좌표를 얻습니다
var info = {
왼쪽 : 0,
상단 : 0,
너비 : obj.width?
높이 : obj.height?
};
if (obj && (obj! = stopobj)) {
//info.left += obj.offsetleft;
//info.top += obj.offsettop;
jpos = $ (obj) .Position ();
info.left += jpos.left;
info.top += jpos.top;
}
반품 정보;
}
실제로 이것은이 플러그인의 원리와 관련이 있으므로 두 개가 겹치지 않으면 위의 문제가 발생합니다.