копировать и вставлять через кнопки с помощью JavaScript? - PullRequest
0 голосов
/ 22 февраля 2019

Я разработал свое собственное контекстное меню, в котором я объявил опции вырезания, копирования, вставки.вырезать и копировать работают нормально.Паста вообще не работает.Если я использую вырезать / копировать через кнопку и нажимаю Ctrl + V, то его вставляют.Мне нужно использовать кнопку, чтобы вставить скопированный текст.Пожалуйста, помогите мне.

Пожалуйста, помогите мне закончить это.-

handleCut=(e)=>{
document.execCommand('cut');
}

handlePaste=(e)=>{
document.execCommand('Paste');
}
<input type='button' value='Cut' onClick={handleCut()} />
<input type='button' value='Paste' onClick={handlePaste()} />

Ответы [ 2 ]

0 голосов
/ 05 марта 2019

Мы можем вставить как обычный текст, но не HTML, так как это ограничено браузером.

onPaste=(event)=>{
try{
     
      if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
      {
         let clipboard_data=window.clipboardData.getData('text');
        // IE <= 10
        if (document.selection){
            var range = document.selection.createRange();
                range.pasteHTML(clipboard_data);
        // IE 11 && Firefox, Opera .....
        }else if(document.getSelection){
            var range = document.getSelection().getRangeAt(0);
            var nnode = document.createElement("SPAN");
                range.surroundContents(nnode);
                nnode.innerHTML =  clipboard_data;
         };
      }
      else if(navigator.userAgent.indexOf("Chrome") != -1 )
      {
          console.log(navigator.userAgent)
          navigator.clipboard.readText()
          .then(text => {
            document.execCommand('insertHTML',false,text);
          })
          .catch(err => {
            console.error('Failed to read clipboard contents: ', err);
          }); 
      }
  
      else 
      {
        alert("Your browser doesn't support Paste")
      }
     
    }
    catch(errMsg)
    {
      alert("Your browser doesn't support Paste");
    }
    finally{
    this.setState({showContextMenu:false})
  }
  
}
<input type='button' onClick={this.onPaste} value='Paste'/>
0 голосов
/ 22 февраля 2019

Попробуйте это

handleCut = (e) => {
  document.querySelector('#a').select();
  document.execCommand('cut');
}

handlePaste = () => {
  navigator.clipboard.readText().then(text => document.querySelector('#a').value = text);
}
<input id="a">
<input type='button' value='Cut' onClick={handleCut()} />
<input type='button' value='Paste' onClick={handlePaste()} />
...