简体   繁体   中英

Copy to Clipboard with javascript for phonegap

i am developing an app using javascript/mobile-jquery interface for the phonegap platform. Now I have seen so many examples on the web trying to copy to clipboard and unfortunatelly none of them worked for me. I am not interested in this being function-able in the browser, as long as it works once it is converted by phone gap I am happy.

I have tried using zeroclipboard, it did not workout, I have tried using clipboard manager could not get it to work. I have tried many other examples that I found here on stackoverflow including google search and they still did not work, here is an example of things i've tried:

window.plugins.clipboardManager.copy(
                "the text to copy",
                function(r){alert("copy is successful")},
                function(e){alert(e)}
            );

I have included the js file:

    <script src="src/clipboardmanager.js"></script>

and I also have the java file in the folder structure as this: src\\com\\saatcioglu\\phonegap\\clipboardmanager\\ClipboardManagerPlugin.java

From what I've read I need to include an xml file for this to work, but for the life of me I could not find that XML file anywhere.

Any help is most appreciated.

Note: My app will require no permissions such as camera, gps, etc...

EDIT:

Another example I tried was:

function select_all(obj) {
    var text_val=eval(obj);
    text_val.focus();
    text_val.select();
    if (!document.all) return; // IE only
    r = text_val.createTextRange();
    r.execCommand('copy');
}

This worked in IE but not in Phonegap.

EDIT:

Here is the html/javascript I'm using:

<html>
    <head>
        <title>Test</title>
            <link rel="stylesheet" href="jquery/jquery.mobile-1.3.1.min.css" />
        <script src="jquery/jquery-1.9.1.min.js"></script>
        <script src="jquery/jquery.mobile-1.3.1.min.js"></script>
            <script src="clipboardmanager.js"></script>
        <script>
                var cbm = new window.plugins.clipboardManager;
                function main(textMessage)
                {
            //Some Code before this (calculations)
                    cbm.copy(
                        "Success!!!",
                        function(r){alert("copy is successful")},
                        function(e){alert(e)}
                    );
                }
            </script>
        </head>
        <body>
        <div data-role="page" id="main" name="main">
            <div data-role="header">
                <h1>Test</h1>
                </div><!-- /header -->

            <div data-role="content">
                <form action="javascript:main(encryptedMessage.value);">
                    Message to be Copied:
                    <textarea id="encryptedMessage" name="encryptedName" rows="6" style="width:99%;"></textarea>
                    <input type="submit" value="Encrypt" />
                </form>
                </div>
        </div>
    </body>
</html>

In my root folder I have:

  1. a folder called jquery which has jquery scripts in there.
  2. a folder called res which has a folder called xml which has a file called plugin.xml
  3. a folder called src which has a folder called com, which has a folder called saatcioglu, which has a folder called phonegap, which has a folder called clipboardmanager, which has a file called ClipboardManagerPlugin.java.
  4. test.html
  5. clipboardmanager.js

Contents of plugin.xml

<?xml version="1.0" encoding="utf-8"?>
<plugins>
    <gap:plugin name="clipboardmanager" value="com.saatcioglu.phonegap.clipboardmanager.ClipboardManagerPlugin.ClipboardManagerPlugin" />
</plugins>

What have I done wrong?

First up: that IE option will not work on Android as PhoneGap uses Webkit (think: Safari and/or Chrome).

Anyway...

That file you're looking for (in the "/res/xml/" subdirectory of your project's directory) is called

config.xml

In there, you have to tell phonegap to load the plugin at compile time like this...

<gap:plugin name="whatever" value="com.example.whatever" />

If you don't do that, phonegap will simply not include the plugin at compile time, resulting in the fact that your plugin won't work (since it doesn't exist in the compiled apk ).

I haven't used the ClipboardManagerPlugin yet, but according to the docs it should go somewhat like this:

<gap:plugin name="clipboardmanager" value="com.saatcioglu.phonegap.clipboardmanager.ClipboardManagerPlugin.ClipboardManagerPlugin" />

Please note that you should check the PhoneGap version you're using and if the plugin is compatible with it. Just in case you're not aware of it: not all plugins have been updated to work with PhoneGap 3.x yet. To quote the readme at Github (https://build.phonegap.com/docs/plugins-using) : "Unless explicitly stated, most of these plugins will not work with Cordova/PhoneGap 3.xx out of the box. They will need updating before they can be used via the plugin add interface."

e-sushi's instructions didn't quite work for me.

To get the plugin running I used the following command:

phonegap local plugin add https://github.com/VersoSolutions/CordovaClipboard

and then adding the following command in JS:

cordova.plugins.clipboard.copy(text);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM