2011-05-15 5 views
2

Я пытаюсь написать сценарий для перетаскивания изображения в iframe в Chrome.Перетаскивание изображения в Chrome

<html> 
<head> 
    <script language="JavaScript"> 

     function InsertImage(ev) 
     { 
      alert("drag function called"); 
      var _image = document.createElement("image"); 
      var _sel = _win.getSelection(); 
      if(!_sel.isCollapsed) 
      { 
       _sel.deleteFromDocument(); 
      } 
      try{ 
       var _range = _sel.getRangeAt(0); 
      } 
      catch(e) 
      { 
       _range = _doc.createRange(); 
       alert("000000:::: "+e); 
       alert("_range is ::"+_range); 
      } 
      if(!_range) 
      { 
       _range = _doc.createRange(); 
      } 
      alert("range is ::::"+_range); 
      try 
      { 
       _range.insertNode(_image); 
      } 
      catch(e) 
      { 
       alert("1111:: "+e); 
      } 
      _range.insertNode(_image); 


     } 

     function init() 
     { 
      _iframe = document.createElement("iframe"); 
      _iframe.id = "view"; 
      _iframe.style.height = "250px"; 
      _iframe.style.width = "600px"; 
      _iframe.style.top = "20px"; 
      _iframe.style.left = "200px"; 
      _iframe.style.position = "absolute"; 
      _iframe.style.border = "2px solid lightBlue"; 
      document.body.appendChild(_iframe); 
       _iframe.contentDocument.designMode="on";//No I18N 
       _win = _iframe.contentWindow; 
       _win.focus(); 
       _doc = _win.document; //making it global variable 

       _doc.body.innerHTML = "<p>aaaa bbbb cccc dddd eeee ffff gggg hhhh iiii jjjj kkkk llll mmmm nnnn oooo pppp qqqq rrrr ssss tttt uuuu vvvv wwww xxxx yyyy zzzz</p>"; 
       _doc.addEventListener("dragover",InsertImage,false); 

     } 

    </script> 
</head> 
<body onLoad="init()"> 
    <div style="position:absolute;top:300px;left:100px "> 
     <p> this si a testing doc.here, we test the things</p> 
    </div> 
</body> 

ли не работает .. В хромированной консоли, я получаю сообщение об ошибке:

Uncaught Error: WRONG_DOCUMENT_ERR: DOM Exception 4

что-то неправильно с выбором и диапазоном, я думаю.

ответ

1

DOMException.WRONG_DOCUMENT_ERR исключение, когда метод манипуляции DOM пытается работать с узлами, которые являются частью два различных DOMDocuments. Вы должны использовать метод DOMDocument.importNode для того, чтобы импорт a DOMNode из одного документа в другой.

Я полагаю, вы должны импортировать изображение-узел в IFrame-документа

что-то вроде (непроверенные):

var nodeToImport = _doc.importNode(_image, true); 
//nodeToImport can now be added to the second document 
_doc.appendChild(nodeToImport); 

more here

+0

Благодаря Casper, он работал в настоящее время, единственное я должен был использовать «** _ doc.appendChild (nodeToImport); **« в соответствующем месте .. – Mickey

Смежные вопросы