There is a tag or attribute for the div but can not find it. When you click on the div, it changed to textarea and in it you could change the contents of the block. This is not a php or js script and not even a css. This is exactly html.

  • <div contenteditable="true">тестовый текст</div> htmlbook.ru/html/attr/contenteditable - Alexey Shimansky
  • @ Alexey Shimansky thanks, it is. and how is it used in php? - BedOmar

1 answer 1

Not everything is as simple as it may seem at first glance. If the attribute is present, a contenteditable div is never converted into a textarea when edited and its contents are not sent to the server when the form is submitted.

But, fortunately, the <div contenteditable> events appear peculiar to the input fields. We can use, for example, blur (roughly speaking - loss of focus).

Create a hidden textarea on the page, put a blur event listener on the <div contenteditable> in which we copy the contents of the div into the hidden textarea .

A simplified code like this:

 <textarea id="textarea" name="description" style="display:none"></textarea> <div id="div" class="textarea" contenteditable="">редактируемый текст</div> <script> $(function(){ $("#div").on('blur', function(){ $("#textarea").val($(this).text()); }); }) </script> 

If you carry out a fully manual submission of the form to the server, that is, you collect all the values ​​from inputs and text fields into an array, then you will not need anything described above. No hidden textarea needed. Simply get $("#div").text() and add it to the data you send.