onClickボタン最大文字長

午後、いくつかのボタンがある簡単なHTMLページを作成しようとしていますが、クリックするとJSが呼び出されてテキストがクリップボードにコピーされ、別の場所に貼り付けることができますWord文書など）。onClickボタン最大文字長

<body> 
    <button onclick="setClipboard('Thank you for your help.')">Greeting</button> 
    <button onclick="setClipboard('Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s')">Item 2</button> 
</body>

これが呼んでいる：

function setClipboard(value) { 
    var tempInput = document.createElement("input"); 
    tempInput.style = "position: absolute; left: -1000px; top: -1000px"; 
    tempInput.value = value; 
    document.body.appendChild(tempInput); 
    tempInput.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(tempInput); 
}

は、それは問題ありませんが、それは動作しません秒1で最初のボタンをコピーすることができます。ボタン＃2にある単語の数を減らしても機能します。それで、長い/多くの言葉がどれくらいあるかによって、それがうまくいかないと思うように導く。

ご協力いただければ幸いです。

出典

2017-08-02 BlindFire2112

2番目のボタン内のテキストがそうのように、それが正常に動作させるために\でエスケープするquoationマーク（'）を必要とするように思える：

function setClipboard(value) { 
 
    var tempInput = document.createElement("input"); 
 
    tempInput.style = "position: absolute; left: -1000px; top: -1000px"; 
 
    tempInput.value = value; 
 
    document.body.appendChild(tempInput); 
 
    tempInput.select(); 
 
    document.execCommand("copy"); 
 
    document.body.removeChild(tempInput); 
 
    console.log(value); 
 
}

<button onclick="setClipboard('Thank you for your help.')">Greeting</button> 
 
<button onclick="setClipboard('Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s')">Item 2</button>

出典

2017-08-02 14:35:47

これは、2番目のボタンのテキストに文字列を中断している単一引用符（ '）が含まれているためです。

<button onclick="setClipboard(`Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s`)">Item 2</button>

バッククォートは、明示的にはECMAScript 6の機能です：あなたはそれがonclick上と引用符の二重引用符で動作させるためにバッククォート（ `）に2番目のボタンのsetClipboardに開始と終了の引用符を変更する必要があります;それらはテンプレートリテラルと呼ばれ、一重引用符と二重引用符の両方が文字列に存在することができます。ブラウザがES6をサポートしていない場合は、一重引用符をバックスラッシュ（\）でエスケープするだけでも動作します。

JSFiddle

出典

2017-08-02 14:34:28

バックチックはJSで有効な文字列区切り文字ではないので、エラーをスローします。 – CBroe

@CBroe ES6で有効な文字列区切り文字ですテンプレートリテラルと呼ばれています。 –

@CBroe証明が必要な場合は、fiddleを参照してください。 –

答えて

関連する問題