Ausschneiden, Kopieren und Einfügen mit JavaScript und jQuery

Da man nicht immer auf das Kontextmenü zugreifen kann, zbsp. bei einem Touch Monitor, ist es sinnvoll einige Aktionen über Schaltflächen anzubieten.
Da hier wieder sehr viel vom Browser abhängt gibt es eigentlich nur 2 Ansätze, entweder über JavaScript und jQuery oder aber mit Adobe Flash. Zum Thema Adobe Flash werde ich separat ein Tutorial schreiben.

Browserkompatibilität

Da hier jeder Browser sein eigenes Süppchen kocht ist es schwierig selbst mit jQuery eine einheitliche Schnittstelle für diesen Support zu bieten.
Zu diesem Thema wird der Microsoft Internet Explorer am besten Unterstützt.Und leider ist dieser auch der einzige welche alle 3 Funktionen bietet.

Mozilla FireFox, Google Chrome support

FireFox und Chrome unterstützen aus diesem Script nur die Funktionen „Ausschneiden“ und „Kopieren“ bei der Funktion „Einfügen“ wird eine Fehlermeldung geworfen, was auch das try catch um den Funktionaufruf erklärt.

Microsoft Internet Explorer

Der Microsoft Internet Explorer erzeugt beim ersten Aufruf einer der Funktionen folgenden Dialog welcher vom Benutzer bestätigt werden muss damit die Seite auf die Zwischenablage zugreifen kann.

Internet Explorer, Dialog zum erlauben / verweigern des Zugriffs auf die Zwischenablage.
Internet Explorer, Dialog zum erlauben / verweigern des Zugriffs auf die Zwischenablage.

Ausschneiden

Kopieren

Einfügen

Der Aufruf der Funktionen, Ausschneiden, Kopieren und Einfügen

Hier nun ein Beispiel wie die oben genannten Funktionen aufgerufen werden:

Beispiel auf jsfiddle

Ein lauffähiges Beispiel finden Sie hier auf jsfiddle.

 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.