JavaScript execCommand('copy') funktioniert nicht

Ich bin nicht in der Lage zu verwenden, die execCommand('copy'), versucht zu kopieren-Wert, der ausgewählt ist, im multi-select-option. iam erste Wert in "temp" - aber der Wert ist immer in temp kopieren oder sich in die Zwischenablage kopieren.

{
        $propArr=array_unique($properties);
        echo "<div class='table-responsive'>";
            echo "<table class='bordered'>";
            foreach($propArr as $keyProp =>$val){
                echo "<tr>";
                    echo "<td>$val</td><td>";
                    echo "<select name='propval' id='propval' onclick='showpropval(this.value);' class='form-control' multiple>";
                    foreach($values as $k => $v){
                        if($val==$k){
                            foreach($v as $kv =>$fval){
                                echo "<option value='$fval'>$fval</option>";
                            }
                        }
                    }
                    echo "</select>";
                    echo"</td>";
                echo "</tr>";
            }
            echo "</table>";
        echo "</div>";
        }

<script>
        function showpropval(val)
        {
            var temp = val;
            temp.execCommand("copy");

        }
    </script>

InformationsquelleAutor Rajesh k | 2017-07-15

execcommand javascript

4

Verstehe ich, dass Ihre Absicht ist folgende: Sie wollen, kopieren Sie die Werte der ausgewählten Optionen in die Zwischenablage, sobald Sie es auswählen.

Wenn Sie document.execCommand('copy') Sie kopieren, was auf der Seite ausgewählt (zum Beispiel Inhalt, der in einem Absatz oder in einem input-Feld selbst).

Der Haken ist jedoch, dass die Auswahl von Optionen in <select> ist nicht als ausgewählten text. Schlimmer noch, wenn Sie möchten, um die trigger-Auswahl von text via javascript gibt es einige Einschränkungen: Sie können nur aufrufen, .wählen Sie() auf eine <input>oder eine <textarea> element.

Hier ist, was ich tun würde: kopieren Sie die ausgewählten Optionen in eine separate (nicht sichtbar) input-Feld, wählen Sie es und kopieren Sie den Inhalt aus.

Hier ist ein Turnschuh, die dienen kann, als eine demo: https://jsfiddle.net/Zomry/metcfvcq/13/

Ich wil Sie brechen hier:

Ersten, fügen Sie dieses element auf der Seite. Dies ist das Eingabe-Feld kopieren wir den Inhalt aus der Zwischenablage. Beachten Sie, dass ich habe tabindex -1, damit die Sie nicht erreichen es über die tab-Taste. Ich habe auch enthalten aria-hidden, so dass Screenreader wissen, sollte es einfach ignorieren.
```
<input class='copyfrom' tabindex='-1' aria-hidden='true'>
```
Dann machen Sie die Eingabe-Feld unsichtbar, indem Sie es vom Bildschirm (hat nicht funktioniert, wenn ich versucht display: none; oder andere tricks)
```
<style>
    .copyfrom {
        position: absolute;
        left: -9999px;
    }
</style>
```
Dann kopieren Sie den Wert in das Eingabefeld, markieren Sie es und kopieren Sie es.
```
var input = document.querySelector("input.copyfrom"); //select the input field

function showpropval(val) {
    var selectedValues = getSelectValues(this); //get selected values
    input.value = test.join(','); //join them in a comma separated list
    input.select(); //select offscreen inputs text
    document.execCommand("copy"); //copy it
    this.focus(); //focus back on original, so we don't see any glitches
} 

//credits to: https://stackoverflow.com/questions/5866169/how-to-get-all-selected-values-of-a-multiple-select-box
function getSelectValues(select) {
    var result = [];
    var options = select && select.options;
    var opt;

    for (var i=0, iLen=options.length; i<iLen; i++) {
        opt = options[i];

        if (opt.selected) {
          result.push(opt.value || opt.text);
        }
    }
  return result;
}
```
Seine Arbeitsmethoden in Ordnung, vielen Dank. hab Ergebnis wie ich es erwartet habe.
Dokument.execCommand("copy") gibt "falsch" für mich.
Vielleicht, hängt von der browser. Getestet habe ich in der neuesten version von Chrome damals. Welchen browser wollen Sie?

InformationsquelleAutor Zomry
1

Hatte ich den anderen Fall von "copy" - Befehl nicht funktioniert. ExecCommand true zurück, aber der Wert wurde nicht kopiert. In meinem Fall war das problem die Funktion, die ausgeführt wird der Befehl (ein Versprechen, um genau zu sein). Vielleicht ein kleines Beispiel (mit der Funktion von Zomry Antwort):
```
function copyToClipboardButtonHandler_Working() {
  //copy logic executed directly here works
  showpropval('this works');
}

function copyToClipboardButtonHandler_NotWorking() {
  //copy logic executed directly here works
  myService.doSomeLogicAndReturnPromiseWithAString().then(text =>
     showpropval(text) /*this does NOT work'*/
  );
}
```
Wenn ich das richtig deute, Befehl muss aufgerufen werden, die in der gleichen Skript-Ausführung iteration, die aufgerufen wurde, von einem Menschen. Da Versprechen-Rückruf in andere iteration, browser verweigert (obwohl es sagt, dass es nicht). Ich weiß nicht, ob dies wahr ist, aber der code funktioniert für mich, und das ist gut 😉

InformationsquelleAutor Sielu
0

ok, mein Ansatz ist ein wenig einfacher:
1. erstellen Sie einen extra-Eingang mit Typ 'text'
2. auf diese Funktion kopiert den Wert der ausgewählten option aus, um die
  zusätzliches Feld
3. geben zusätzliches Feld mit position absolute und Links -9999 es gibt in
  dom-aber nicht im sichtbaren viewport!
4. tun den rest!
hier ein Beispiel:
```
function copyUserName() {

    //just_for_copy is my invisible extra field
    document.getElementById('just_for_copy').value = document.getElementById('user_phone').value;

    var justForCopy = document.getElementById('just_for_copy');

    justForCopy.select();

    document.execCommand("copy");
}
```
InformationsquelleAutor Alireza Noori

-1

Versuchen Sie dies:

function showpropval(val) {
    var temp = val;
    document.execCommand("copy",false,val);
}

Nein @ledaivuong, es funktioniert nicht.

InformationsquelleAutor ledaivuong

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.