javascript - Javascript OnPaste

Question

私は今これを持っています：

<input type="text" placeholder="Paste text" onPaste="alert(this.value);">

これは実際には機能しますが、空白のアラートウィンドウが返されます。何の価値もありません。ヘルプ？

score 46 · Accepted Answer

が変更される前にonpasteイベントが発生します。次のようなものが必要です。inputvaluesetTimeout

<input type="text" placeholder="Paste text" onPaste="var e=this; setTimeout(function(){alert(e.value);}, 4);">

ウィンドウオブジェクトにアタッチされているタイムアウト関数のスコープ内ではアクセスできないためthis、グローバル変数内への参照を保存しています。this

HTML5仕様で有効な最小間隔/タイムアウトであるため、タイムアウトとして4ミリ秒を使用しています。編集:コメントに記載されているように、0自動的にに再計算される timeOut としてミリ秒を使用することもできます4。jsPerf テスト.

onpasteイベントパス内で関数呼び出しをthisパラメーターとして使用して、HTML が JS と混ざりすぎないようにすることもできます。:)

そして、読みやすく、複数の入力で使用できる関数を次に示します。

function pasted(element) {
    setTimeout(function(){
        alert(element.value);
    }, 0); //or 4
}

onPaste="pasted(this)"これは、任意の入力に対して単純に呼び出すことができます。

score 10 · Accepted Answer

これは、コンテンツが要素 ( link )に貼り付けられる前onpasteにイベントが発生するため、それを処理する時点ではまだ存在していないためです。

最新のブラウザーは、イベントハンドラー内でクリップボードデータを取得する方法をサポートしています。クロスブラウザーソリューションの試みについては、貼り付けイベント (クロスブラウザー) でクリップボードデータを取得する JavaScriptを参照してください。

また、後で入力値をチェックするイベントハンドラー関数 (10 ミリ秒で十分) でタイマーを開始するだけで、いつでも問題を回避できます。

2 に答える 2