admin管理员组

文章数量:1289540

I am trying to handle the paste event and trying to convert rich text into plain text, I have a content editable (dynamically created) div inside a container with id main

$("#main").on("paste","div",function(event){
  event.preventDefault();
  var clipboarddata =  event.clipboardData ||window.clipboardData || event.originalEvent.clipboardData;                  
  var onlytext = clipboarddata.getData('text/plain');
  document.execCommand("insertHTML", false, onlytext);
});

Uncaught TypeError: Cannot read property 'getData' of undefined

I think event.clipboarddata is not working, my browser supports clipboard API. i am copying the text and pasting it into div. So clipboard should have some value

Can someone explain why I clipboardData is undefined

I am trying to handle the paste event and trying to convert rich text into plain text, I have a content editable (dynamically created) div inside a container with id main

$("#main").on("paste","div",function(event){
  event.preventDefault();
  var clipboarddata =  event.clipboardData ||window.clipboardData || event.originalEvent.clipboardData;                  
  var onlytext = clipboarddata.getData('text/plain');
  document.execCommand("insertHTML", false, onlytext);
});

Uncaught TypeError: Cannot read property 'getData' of undefined

I think event.clipboarddata is not working, my browser supports clipboard API. i am copying the text and pasting it into div. So clipboard should have some value

Can someone explain why I clipboardData is undefined

Share Improve this question edited Jan 16, 2017 at 16:51 beginner asked Jan 16, 2017 at 16:32 beginnerbeginner 2,5084 gold badges32 silver badges54 bronze badges 6
  • Note that in event.originalEvent.clipboarddata the "d" in "data" should be "D". – Pointy Commented Jan 16, 2017 at 16:35
  • @pointy yes ,i correct it, But still same error – beginner Commented Jan 16, 2017 at 16:39
  • 1 OK, well, understand that security considerations may prevent your code from gaining access to the clipboard data. Your code should check to make sure that there is data before assuming it can be used. – Pointy Commented Jan 16, 2017 at 16:40
  • @pointy any solution for that – beginner Commented Jan 16, 2017 at 16:45
  • Yes. Check the value to make sure it isn't defined. If the browser won't give you the data, there's nothing you can do to force it. – Pointy Commented Jan 16, 2017 at 17:01
 |  Show 1 more ment

2 Answers 2

Reset to default 4

For latest browser Chrome below line will work.

var clipboarddata = window.event.clipboardData.getData('text');

$(document).ready(function(){

 $("#main").on("paste",function(event){
      event.preventDefault();
      var clipboarddata =  window.event.clipboardData.getData('text');    
      console.log("paste value" + clipboarddata);
      $('#pasteData').text(clipboarddata);
    });
    
});
<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="main" name="first_name" value="" maxlength="100" />
<div>paste value :  <span id="pasteData"><span></div>

NOTE: This is WHY you are getting the error. Fixing the bug is a different matter and one that would need more information from you.

The reason you are getting the error is because when you use OR operators on variable assignment, it will always assign the value of the last one, even if it is null, false, or undefined.

Basically, it goes like this

if (event.clipboardData != null/false/undefined) { //ignore the incorrectness of the truncation
  var clipboarddata = event.clipboardData;
} else if (window.clipboardData != null/false/undefined) {
  var clipboarddata = window.clipboardData;
} else { //default to the last option even if it is null/false/undefined
  var clipboarddata = event.originalEvent.clipboardData;
}

So since all three are undefined, you get the value of event.originalEvent.clipboardData which is undefined assigned to the variable. Hence the error on the next line.

本文标签: javascriptUncaught TypeError Cannot read property 39getData39 of undefinedStack Overflow