How can I make javascript copy to clipboard function not to print extra line break for android?

问题

With the same copy to clipboard javascript function has generated different output in Iphone(IOS) and Android phone. However, the IOS output is what I want to achieve for both IOS and Android.

Anything to add in to my copy to clipboard function to get the output same as IOS for Android?

Result after copy and paste for IOS:

Date:12/5/2019
Address: US
School: Havard
Movie: Avenger
Hobby: Sleep

Result after copy and paste for Android: (With extra line break)

Date:12/5/2019

Address: US

School: Havard

Movie: Avenger

Hobby: Sleep

This is my html/css/js at a glance:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- <link rel="stylesheet" type="text/css" media="screen" href="main.css" /> -->
    <!-- <script src="main.js"></script> -->
    <style>
        li {
            list-style-type: none;
        }
    </style>
</head>
<body>
    <div style="text-align: left" id="report" contenteditable="false">
        <li>Date:12/5/2019</li>
        <li>Address: US</li>
        <li>School: Havard</li>
        <li>Movie: Avenger</li>
        <li>Hobby: Sleep</li>
    </div>
    <div>
        <button id="button1" onclick="CopyToClipboard('report')">Click to copy</button>
        <textarea hidden placeholder="Press ctrl+v to Paste the copied text" rows="5" cols="20"></textarea>
    </div>
    <script>
        function CopyToClipboard(containerid) {
            if (document.selection) {
                var range = document.body.createTextRange();
                range.moveToElementText(document.getElementById(containerid));
                range.select().createTextRange();
                document.execCommand("copy");
                alert("value copied");

            }
            else if (window.getSelection) {
                var range = document.createRange();
                range.selectNode(document.getElementById(containerid));
                window.getSelection().removeAllRanges();
                window.getSelection().addRange(range);
                document.execCommand("copy");
                alert("text copied");
            }
        };
    </script>
</body>
</html>

You can also direct access to this link with your Iphone/Android phone to try copy and paste: http://upbeat-cori-a6706b.bitballoon.com/

来源：https://stackoverflow.com/questions/50724191/how-can-i-make-javascript-copy-to-clipboard-function-not-to-print-extra-line-bre

标签

javascript

android

html

css

copy-paste