फायरफॉक्स, सफारी और क्रोम के साथ क्लिपबोर्ड पर टेक्स्ट को कॉपी / पेस्ट करें

Question

Internet Explorer में मैं क्लिपबोर्ड तक पहुँचने के लिए क्लिपबोर्डडॉट ऑब्जेक्ट का उपयोग कर सकता हूं। मैं फ़ायरफ़ॉक्स, सफारी और / या क्रोम में कैसे कर सकता हूं?

Comments

आप क्रोम कंसोल में ऐसा करना चाहते हैं, तो आप उपयोग कर सकते हैं copy, developer.chrome.com/devtools/docs/commandline-api

— wener

जावास्क्रिप्ट में क्लिपबोर्ड पर प्रतिलिपि बनाने के लिए कैसे

— bjb568

@ bjb568, आपके द्वारा उल्लेखित प्रश्न बाद में दर्ज किया गया था, इसलिए यह डुप्लिकेट है

— GvS

@GvS यह हमेशा ऐसा नहीं होता है जिसके बारे में पहले पोस्ट किया जाता है। अन्य एक अधिक लोकप्रिय था और अधिक उत्तर मिला। यदि आप थियो चाहते हैं, तो इसे फ़्लैग करें ताकि एक मध्यस्थ प्रश्नों को मर्ज कर सके।

— bjb568

जवाब में अच्छी तरह से दस्तावेज stackoverflow.com/a/30810322/712334

— जोश Habdas

Answer 1

अब इसका उपयोग करने वाले अधिकांश आधुनिक ब्राउज़रों में आसानी से करने का एक तरीका है

document.execCommand('copy');

यह वर्तमान में चयनित पाठ की प्रतिलिपि बनाएगा। आप एक textArea या इनपुट फ़ील्ड का उपयोग करके चयन कर सकते हैं

document.getElementById('myText').select();

अदृश्य रूप से पाठ की प्रतिलिपि बनाने के लिए आप जल्दी से एक टेक्स्ट तैयार कर सकते हैं, बॉक्स में पाठ को संशोधित कर सकते हैं, इसे चुन सकते हैं, इसे कॉपी कर सकते हैं, और फिर टेक्स्ट को हटा सकते हैं। ज्यादातर मामलों में यह textArea स्क्रीन पर भी फ्लैश नहीं करेगा।

सुरक्षा कारणों से, यदि उपयोगकर्ता किसी प्रकार की कार्रवाई करता है (यानी एक बटन पर क्लिक करके) तो ब्राउज़र आपको केवल कॉपी करने देगा। ऐसा करने का एक तरीका एक HTML बटन पर एक ऑनक्लिक घटना को जोड़ना होगा जो एक विधि को कॉल करता है जो पाठ को कॉपी करता है।

एक पूर्ण उदाहरण:

function copier(){
  document.getElementById('myText').select();
  document.execCommand('copy');
}

<button onclick="copier()">Copy</button>
<textarea id="myText">Copy me PLEASE!!!</textarea>

Answer 2

सुरक्षा कारणों से, फ़ायरफ़ॉक्स आपको क्लिपबोर्ड पर पाठ रखने की अनुमति नहीं देता है। हालाँकि, फ़्लैश का उपयोग करते हुए एक काम उपलब्ध है।

function copyIntoClipboard(text) {

    var flashId = 'flashId-HKxmj5';

    /* Replace this with your clipboard.swf location */
    var clipboardSWF = 'http://appengine.bravo9.com/copy-into-clipboard/clipboard.swf';

    if(!document.getElementById(flashId)) {
        var div = document.createElement('div');
        div.id = flashId;
        document.body.appendChild(div);
    }
    document.getElementById(flashId).innerHTML = '';
    var content = '<embed src="' + 
        clipboardSWF +
        '" FlashVars="clipboard=' + encodeURIComponent(text) +
        '" width="0" height="0" type="application/x-shockwave-flash"></embed>';
    document.getElementById(flashId).innerHTML = content;
}

एकमात्र नुकसान यह है कि इसके लिए फ्लैश सक्षम होना चाहिए।

स्रोत वर्तमान में मर चुका है: http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/ ( और इसलिए यह Google कैश है )

Comments

एक तीसरा नुकसान यह है कि फ्लैश पर अनुमतियों को बदलने के बिना यह स्थानीय रूप से काम नहीं करेगा (फ़ाइल: //)। code.google.com/p/zeroclipboard इस पद्धति के आसपास निर्मित एक पुस्तकालय है।

— रेगी फ्राय

@ b1naryatr0phy: अधिकांश भाग के लिए सही है, लेकिन HTML5 में अभी भी फ्लैश द्वारा पेश किए गए क्लिपबोर्ड की कार्यक्षमता के लिए प्रतिस्थापन नहीं है (जैसे कि ZeroClipboard का उपयोग करके)।

— जेम्स एम। ग्रीन

2014 तक, यह विधि अब किसी भी आधुनिक ब्राउज़र में काम नहीं करती है। ZeroClipboard एकमात्र तकनीक है जो वर्तमान में इसका हल करती है

— कूजमारा

सितंबर 2015 तक, फ्लैश एक अपेक्षाकृत त्वरित मौत मर रहा है और ZeroClipboard इसके उपयोग के आसपास आधारित है। एक समाधान के लिए अगस्त 2015 से नीचे दिए गए मेरे जवाब को देखें जो फ्लैश का उपयोग नहीं करता है।

— एक कोडर

Answer 3

ऑनलाइन स्प्रेडशीट हुक Ctrl + C, Ctrl + V ईवेंट्स और एक छिपे हुए TextArea नियंत्रण पर फ़ोकस करें और या तो पेस्ट के लिए ईवेंट समाप्त होने के बाद उसकी सामग्री को कॉपी करने के लिए वांछित नई क्लिपबोर्ड सामग्री पर सेट करें या उसकी सामग्री पढ़ें।

यह भी देखें कि क्या जावास्क्रिप्ट का उपयोग करके फ़ायरफ़ॉक्स, सफारी और क्रोम में क्लिपबोर्ड पढ़ना संभव है?

Answer 4

यह समर 2015 है, और फ्लैश के आसपास इतनी उथल-पुथल के साथ मैंने सोचा कि मैं इस सवाल का एक नया जवाब जोड़ दूंगा जो इसके उपयोग से पूरी तरह से बचता है।

क्लिपबोर्ड.जेएस एक अच्छी उपयोगिता है जो क्लिपबोर्ड पर पाठ या एचटीएमएल डेटा की प्रतिलिपि बनाने की अनुमति देता है। इसका उपयोग करना बहुत आसान है, बस .js को शामिल करें और कुछ इस तरह का उपयोग करें:

<button id='markup-copy'>Copy Button</button>

<script>
document.getElementById('markup-copy').addEventListener('click', function() {
  clipboard.copy({
    'text/plain': 'Markup text. Paste me into a rich text editor.',
    'text/html': '<i>here</i> is some <b>rich text</b>'
  }).then(
    function(){console.log('success'); },
    function(err){console.log('failure', err);
  });

});
</script>

क्लिपबोर्ड.जेएस गीथहब पर भी है

Comments

पहला लिंक जो आप प्रदान करते हैं (npmjs.com पर) कहते हैं कि यह IE के साथ काम नहीं करता है, लेकिन यह करता है (जैसा कि यह GitHub पर कहता है)

— gordon613

Answer 5

2017 में आप ऐसा कर सकते हैं (यह कहते हुए क्योंकि यह धागा लगभग 9 साल पुराना है!)

function copyStringToClipboard (string) {
    function handler (event){
        event.clipboardData.setData('text/plain', string);
        event.preventDefault();
        document.removeEventListener('copy', handler, true);
    }

    document.addEventListener('copy', handler, true);
    document.execCommand('copy');
}

और अब कॉपी करना है copyStringToClipboard('Hello World')

यदि आपने setDataरेखा पर ध्यान दिया है , और आश्चर्य है कि क्या आप अलग-अलग डेटा सेट कर सकते हैं तो उत्तर हां है।

Comments

सफारी के लिए मैं .select()यह फोन करने से पहले एक इनपुट बॉक्स पर चलाने की जरूरत है ।

— चाड विज्ञान जू

क्या आपको इवेंट श्रोता को भी हटा देना चाहिए?

— क्रिस वॉल्श

@ क्रिस वॉल्श हां, यह कोड नमूने में हैंडलर के अंदर किया जाता है। कारण यह है कि हैंडलर अभी भी स्मृति में होगा।

— स्पाइक

Answer 6

फ़ायरफ़ॉक्स आपको क्लिपबोर्ड में डेटा संग्रहीत करने की अनुमति देता है, लेकिन सुरक्षा निहितार्थ के कारण यह डिफ़ॉल्ट रूप से अक्षम है। मोज़िला फ़ायरफ़ॉक्स ज्ञान के आधार में "क्लिपिंग के लिए जावास्क्रिप्ट एक्सेस प्रदान करना" में इसे कैसे सक्षम करें देखें ।

यदि आपके पास बहुत सारे उपयोगकर्ता हैं और उनके ब्राउज़र को कॉन्फ़िगर करना एक विकल्प नहीं है, तो amdfan द्वारा प्रस्तुत समाधान सबसे अच्छा है। हालांकि आप यह जांच सकते हैं कि क्लिपबोर्ड उपलब्ध है या नहीं, यदि उपयोगकर्ता तकनीकी जानकार हैं, तो सेटिंग्स को बदलने के लिए एक लिंक प्रदान करें। जावास्क्रिप्ट संपादक TinyMCE इस दृष्टिकोण का अनुसरण करता है।

Answer 7

CopyIntoClipboard () फ़ंक्शन फ़्लैश 9 के लिए काम करता है, लेकिन यह फ़्लैश प्लेयर 10 की रिलीज़ से टूटता हुआ प्रतीत होता है। यहां एक समाधान है जो नए फ़्लैश प्लेयर के साथ काम करता है:

http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/

यह एक जटिल समाधान है, लेकिन यह काम करता है।

Comments

इसके टूटे नहीं। इसे सुरक्षा कारणों से नवीनतम एपीआई से हटा दिया गया

— ग्लिसरीन

Answer 8

मेरा कहना है कि इनमें से कोई भी समाधान वास्तव में काम नहीं करता है। मैंने स्वीकृत उत्तर से क्लिपबोर्ड समाधान की कोशिश की है, और यह फ़्लैश प्लेयर 10 के साथ काम नहीं करता है। मैंने ज़ीरोक्लिपबोर्ड की भी कोशिश की है, और मैं थोड़ी देर के लिए बहुत खुश था।

मैं वर्तमान में इसे अपनी साइट ( http://www.blogtrog.com ) पर उपयोग कर रहा हूं , लेकिन मैं इसके साथ अजीब कीड़े देख रहा हूं। जिस तरह से ZeroClipboard काम करता है वह यह है कि यह आपके पृष्ठ पर एक तत्व के शीर्ष पर एक अदृश्य फ़्लैश ऑब्जेक्ट डालता है। मैंने पाया है कि यदि मेरा तत्व चलता है (जैसे जब उपयोगकर्ता विंडो को आकार देता है और मेरे पास चीजें ठीक से संरेखित होती हैं), तो ZeroClipboard फ़्लैश ऑब्जेक्ट व्हेक से बाहर हो जाता है और अब ऑब्जेक्ट को कवर नहीं करता है। मुझे संदेह है कि यह शायद अभी भी बैठा है जहां यह मूल रूप से था। उनके पास कोड है जो इसे रोकना है, या इसे तत्व को पुनर्स्थापित करना है, लेकिन यह अच्छी तरह से काम नहीं करता है।

इसलिए ... BlogTrog के अगले संस्करण में, मुझे लगता है कि मैं उन सभी अन्य कोड हाइलाइटर्स के साथ सूट का पालन करूंगा, जिन्हें मैंने जंगल में देखा है और क्लिपबोर्ड बटन पर अपनी कॉपी हटा दें। :-(

(मैंने देखा कि क्लिपबोर्ड पर dp.syntaxhiglighter की कॉपी अब भी टूट गई है।)

Comments

यह दुख की बात है जब कार्यक्षमता को सुरक्षा के नाम पर एक कदम पीछे ले जाना पड़ता है। मैं वास्तव में चाहता हूं कि एक समाधान था जो दोनों सुरक्षित था और अभी भी एक वेब पेज से क्लिपबोर्ड तक पहुंच की अनुमति देता है, भले ही उपयोगकर्ता को एक या कुछ बार स्पष्ट अनुमति देनी पड़े।

— devios1

आईई डिफ़ॉल्ट रूप से यही करता है

— मैथ्यू लॉक

Answer 9

वैसे भी बहुत पुराना सवाल है, लेकिन मुझे यह जवाब कहीं नहीं मिला ...

इस लिंक की जाँच करें:

http://kb.mozillazine.org/Granting_JavaScript_access_to_the_clipboard

जैसा कि सभी ने कहा, सुरक्षा कारणों से डिफ़ॉल्ट रूप से अक्षम है। ऊपर दिए गए लिंक से पता चलता है कि इसे कैसे सक्षम किया जाए (फायरफॉक्स या user.js में विन्यास के बारे में संपादन करके)।

सौभाग्य से "AllowClipboardHelper" नामक एक प्लगइन है जो केवल कुछ क्लिकों के साथ चीजों को आसान बनाता है। हालाँकि आपको अभी भी अपनी वेबसाइट के आगंतुकों को यह निर्देश देने की आवश्यकता है कि फ़ायरफ़ॉक्स में पहुँच को कैसे सक्षम किया जाए।

Comments

क्या ऐसा नहीं है कि Chrome / WebKit के लिए ऐसा कुछ है?

— devios1

Answer 10

आधुनिक दस्तावेज़ का उपयोग करें ।execCommand ("कॉपी") और jQuery। इस स्टैकओवरफ़्लो उत्तर को देखें

var ClipboardHelper = { // as Object

copyElement: function ($element)
{
   this.copyText($element.text())
},
copyText:function(text) // Linebreaks with \n
{
    var $tempInput =  $("<textarea>");
    $("body").append($tempInput);
    $tempInput.val(text).select();
    document.execCommand("copy");
    $tempInput.remove();
}};

कैसे कॉल करें:

 ClipboardHelper.copyText('Hello\nWorld');
 ClipboardHelper.copyElement($('body h1').first());

// JQUERY DOCUMENT
;(function ( $, window, document, undefined ) {
  
  var ClipboardHelper = {

    copyElement: function ($element)
    {
       this.copyText($element.text())
    },
    copyText:function(text) // Linebreaks with \n
    {
        var $tempInput =  $("<textarea>");
        $("body").append($tempInput);
      
        //todo prepare Text: remove double whitespaces, trim
        
        $tempInput.val(text).select();
        document.execCommand("copy");
        $tempInput.remove();
    }
};

    $(document).ready(function()
    {
         var $body=$('body');
         
        $body.on('click', '*[data-copy-text-to-clipboard]', function(event) 
        {
            var $btn=$(this);
            var text=$btn.attr('data-copy-text-to-clipboard');
            ClipboardHelper.copyText(text);
        });
      
        $body.on('click', '.js-copy-element-to-clipboard', function(event) 
        {
            ClipboardHelper.copyElement($(this));
        });

    });


})( jQuery, window, document );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<span data-copy-text-to-clipboard=
"Hello
 World">
  Copy Text
</span>
<br><br>
<span class="js-copy-element-to-clipboard">
Hello
World 
Element
</span>

Answer 11

मैंने अपनी आवश्यकताओं के लिए Github's Clippy का उपयोग किया है , सरल फ़्लैश-आधारित बटन। ठीक काम करता है, अगर किसी को स्टाइल की आवश्यकता नहीं है और पहले से ही सर्वर-साइड पर पेस्ट करने के लिए डालने से प्रसन्न है ।

Answer 12

फ़्लैश सॉल्यूशन में थोड़ा सुधार फ़्लैश 10 का उपयोग करने के लिए पता लगाने के लिए है swfobject का उपयोग करते हुए:

http://code.google.com/p/swfobject/

और फिर अगर यह फ्लैश 10 के रूप में दिखाता है, तो जावास्क्रिप्ट का उपयोग करके एक शॉकवेव ऑब्जेक्ट को लोड करने का प्रयास करें। Shockwave क्लिपबोर्ड (सभी संस्करणों में) के साथ-साथ लिंगो में copyToClipboard () कमांड का उपयोग करके पढ़ / लिख सकता है।

Answer 13

http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.asp फ्लैश 10 और सभी फ्लैश सक्षम ब्राउज़रों के साथ काम करता है।

इसके अलावा पेज स्क्रॉलिंग के बारे में उल्लिखित बग से बचने के लिए ZeroClipboard को अपडेट किया गया है, जिससे फ़्लैश फिल्म अब सही जगह पर नहीं है।

चूँकि उस विधि को "कॉपी करने के लिए" उपयोगकर्ता को एक बटन पर क्लिक करने की आवश्यकता होती है, इसलिए यह उपयोगकर्ता के लिए एक सुविधा है और कुछ भी नहीं होने वाला है।

Answer 14

चयन को संग्रहीत करते हुए एक मेमोरी ग्लोबल वैरिएबल बनाने का प्रयास करें, फिर अन्य फ़ंक्शन चर तक पहुंच सकते हैं और उदाहरण के लिए एक पेस्ट कर सकते हैं।

var memory = '';//outside the functions but within the script tag.

function moz_stringCopy(DOMEle,firstPos,secondPos) {

var copiedString = DOMEle.value.slice(firstPos, secondPos);
memory = copiedString;

}

function moz_stringPaste(DOMEle, newpos) {

    DOMEle.value = DOMEle.value.slice(0,newpos) + memory + DOMEle.value.slice(newpos);

}

Comments

किसी और से कॉपी कर सकता है, जहां अकेले पेज के अंदर विचार नहीं किया गया है

— मारवान

Answer 15

यदि आप फ्लैश का समर्थन करते हैं तो आप https://everyplay.com/assets/clipboard.swf का उपयोग कर सकते हैं और टेक्स्ट सेट करने के लिए फ्लैशवर्स टेक्स्ट का उपयोग कर सकते हैं

https://everyplay.com/assets/clipboard.swf?text=It%20Works

Thats जिसे मैं कॉपी करने के लिए उपयोग करता हूं और यदि आप इन विकल्पों का समर्थन नहीं कर सकते हैं तो आप अतिरिक्त सेट कर सकते हैं:

Internet Explorer के लिए: window.clipboardData.setData (DataFormat, Text) और window.clipboardData.getData (DataFormat)

आप GetData और setData के लिए DataFormat के पाठ और यूआरएल का उपयोग कर सकते हैं।

और डेटा हटाने के लिए:

आप DataFormat की फ़ाइल, HTML, छवि, पाठ और URL का उपयोग कर सकते हैं। पुनश्च: आपको window.clipboardData.clearData (DataFormat) का उपयोग करने की आवश्यकता है;

और अन्य दस्‍तावेजों के लिए window.clipboardData और swf फ़्लैश फ़ाइलों का समर्थन नहीं करते हैं, आप अपने कीबोर्ड पर नियंत्रण + c बटन का उपयोग भी कर सकते हैं विंडोज़ के लिए और इसके कमांड + c के लिए

Answer 16

Addon कोड से:

यदि कोई अन्य व्यक्ति क्रोम कोड से इसे करना चाहता है, तो आप यहाँ वर्णित के रूप में nsIClipboardHelper इंटरफ़ेस का उपयोग कर सकते हैं: https://developer.mozilla.org/en-US/docs/Using_the_Clipboard

Answer 17

का उपयोग करें document.execCommand('copy')। के नवीनतम संस्करण में समर्थित Chrome, Firefox, Edge, और Safari।

function copyText(text){
  function selectElementText(element) {
    if (document.selection) {
      var range = document.body.createTextRange();
      range.moveToElementText(element);
      range.select();
    } else if (window.getSelection) {
      var range = document.createRange();
      range.selectNode(element);
      window.getSelection().removeAllRanges();
      window.getSelection().addRange(range);
    }
  }
  var element = document.createElement('DIV');
  element.textContent = text;
  document.body.appendChild(element);
  selectElementText(element);
  document.execCommand('copy');
  element.remove();
}


var txt = document.getElementById('txt');
var btn = document.getElementById('btn');
btn.addEventListener('click', function(){
  copyText(txt.value);
})

<input id="txt" value="Hello World!" />
<button id="btn">Copy To Clipboard</button>

Answer 18

क्लिपबोर्ड एपीआई को सुपरसाइड के लिए डिज़ाइन किया गया है document.execCommand। सफ़ारी अभी भी समर्थन पर काम कर रही है, इसलिए आपको तब तक कमबैक करना चाहिए जब तक कि स्पेक सेटल और सफ़ारी खत्म न हो जाए।

const permalink = document.querySelector('[rel="bookmark"]');
const output = document.querySelector('output');
permalink.onclick = evt => {
  evt.preventDefault();
  window.navigator.clipboard.writeText(
    permalink.href
  ).then(() => {
    output.textContent = 'Copied';
  }, () => {
    output.textContent = 'Not copied';
  });
};

<a href="/programming/127040/" rel="bookmark">Permalink</a>
<output></output>

सुरक्षा कारणों से क्लिपबोर्ड Permissionsको क्लिपबोर्ड से पढ़ना और लिखना आवश्यक हो सकता है। यदि स्निपेट एसओ पर काम नहीं करता है, तो इसे एक शॉट पर localhostया अन्यथा विश्वसनीय डोमेन दें।

Answer 19

Studio.201 से @David के उत्कृष्ट उत्तर का निर्माण, यह सफारी, एफएफ और क्रोम में काम करता है। यह यह भी सुनिश्चित करता है कि textareaइसे ऑफ-स्क्रीन रखने से कोई फ्लैशिंग न हो ।

// ================================================================================
// ClipboardClass
// ================================================================================
var ClipboardClass = (function() {


   function copyText(text) {
    // Create temp element off-screen to hold text.
        var tempElem = $('<textarea style="position: absolute; top: -8888px; left: -8888px">');
        $("body").append(tempElem);

        tempElem.val(text).select();
        document.execCommand("copy");
        tempElem.remove();
   }


    // ============================================================================
   // Class API
   // ============================================================================
    return {
        copyText: copyText
    };
})();