简体   繁体   中英

How to get HTML DIV value

I'm trying to do screen shot paste in my website using firefox. It can be done easily by giving the div as contenteditable='true' .

html

<Html>
<Head>
<Title>Screen Shot Example</Title>
<style type="text/css">
#apDiv1 {
    position:absolute;
    width:258px;
    height:165px;
    z-index:1;
    left: 71px;
    top: 59px;
}
</style>
</Head>

<Body>
<div id="apDiv1" contenteditable='true'>Paste Test</div>
</Body>
</Html> 

I can paste images from clipboard to particular div. Now the issue starts, how do I get the value from the div. For an example my user paste screenshot in the div and i want it to be save in db. If it normal textbox I can get the textbox value. Is there any way I can convert the DIV to image. Any advice and any referral links is highly appreciated.

document.addEventListener('DOMContentLoaded', function(){ 
    var text = document.getElementById('apDiv1').innerText;
}, false);

To replace the div :

document.addEventListener('DOMContentLoaded', function(){ 
    var el = document.getElementById("apDiv1");
    var img = document.createElement("img");
    img.setAttribute('src', '...');
    el.parentNode.replaceChild(el, img);
}, false);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM