Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Obrazek w textarea help, Umieść obrazek w textarea
programista28
post 28.05.2012, 12:46:32
Post #1





Grupa: Zarejestrowani
Postów: 88
Pomógł: 2
Dołączył: 14.05.2011

Ostrzeżenie: (0%)
-----



Witam jak wstawić obrazek do textarea tak by był on wyświetlany jako obraz (nie jako link ) w javascript ?


<textarea></textarea>







Go to the top of the page
+Quote Post
Kshyhoo
post 28.05.2012, 12:49:55
Post #2





Grupa: Opiekunowie
Postów: 3 855
Pomógł: 317
Dołączył: 4.01.2005
Skąd: że




  1. <img alt="" src="00.jpg" style="width: 100px; height: 100px;" />


--------------------
Go to the top of the page
+Quote Post
skowron-line
post 28.05.2012, 12:53:06
Post #3





Grupa: Zarejestrowani
Postów: 4 340
Pomógł: 542
Dołączył: 15.01.2006
Skąd: Olsztyn/Warszawa

Ostrzeżenie: (0%)
-----


Nie da się, textarea przyjmuje tylko i wyłącznie tekst.


--------------------
I'm so fast that last night I turned off the light switch in my hotel room and was in bed before the room was dark - Muhammad Ali.
Peg jeżeli chcesz uprawiać sex to dzieci muszą wyjść, a jeżeli chcesz żeby był dobry ty też musisz wyjść - Al Bundy.

QueryBuilder, Mootools.net, bbcradio1::MistaJam
http://www.phpbench.com/
Go to the top of the page
+Quote Post
programista28
post 28.05.2012, 13:13:01
Post #4





Grupa: Zarejestrowani
Postów: 88
Pomógł: 2
Dołączył: 14.05.2011

Ostrzeżenie: (0%)
-----


kshyhoo sprawdziłem twój kod nie działa niesteety sad.gif (to by bylo za proste smile.gif)

Skworon line da sie ściągnąłem wysiwyg gdzie wyraźnie widać że polem tekstowym do którego jest wkładany obrzek jest textarea też mi się nie chciało wierzyć bo czytałem już podobne opinie jak twoja ale tak jest w text area umieszczany jest obrazek który potem można ustawiać

nadal czekam na pomoc w tym temacie
Go to the top of the page
+Quote Post
IceManSpy
post 28.05.2012, 13:16:48
Post #5





Grupa: Zarejestrowani
Postów: 1 006
Pomógł: 111
Dołączył: 23.07.2010
Skąd: Kraków

Ostrzeżenie: (0%)
-----


Bo widziałeś może edytor wysiwyg:
http://www.tinymce.com/tryit/full.php


--------------------
Go to the top of the page
+Quote Post
programista28
post 28.05.2012, 14:36:55
Post #6





Grupa: Zarejestrowani
Postów: 88
Pomógł: 2
Dołączył: 14.05.2011

Ostrzeżenie: (0%)
-----


nie miałem na myśli ten edytor : openWYSIWYG
Go to the top of the page
+Quote Post
skowron-line
post 28.05.2012, 14:47:01
Post #7





Grupa: Zarejestrowani
Postów: 4 340
Pomógł: 542
Dołączył: 15.01.2006
Skąd: Olsztyn/Warszawa

Ostrzeżenie: (0%)
-----


@programista28 a wiesz na jakiej zasadzie działa wysiwyg questionmark.gif To że widzisz tam textarea wcale nie oznacza że on tam jest.


--------------------
I'm so fast that last night I turned off the light switch in my hotel room and was in bed before the room was dark - Muhammad Ali.
Peg jeżeli chcesz uprawiać sex to dzieci muszą wyjść, a jeżeli chcesz żeby był dobry ty też musisz wyjść - Al Bundy.

QueryBuilder, Mootools.net, bbcradio1::MistaJam
http://www.phpbench.com/
Go to the top of the page
+Quote Post
programista28
post 28.05.2012, 15:01:02
Post #8





Grupa: Zarejestrowani
Postów: 88
Pomógł: 2
Dołączył: 14.05.2011

Ostrzeżenie: (0%)
-----


no tak ale jednak obrazek musi być skojarzony z polem textarea żeby został wysłany tak ? bo teraz to już sam nie wiem smile.gif

(właśnie szukam tego po stronach ale nigdzie tego nie ma żeby móc sobie obczaić co i jak sad.gif )
Go to the top of the page
+Quote Post
skowron-line
post 28.05.2012, 15:04:15
Post #9





Grupa: Zarejestrowani
Postów: 4 340
Pomógł: 542
Dołączył: 15.01.2006
Skąd: Olsztyn/Warszawa

Ostrzeżenie: (0%)
-----


http://www.devarticles.com/c/a/HTML/Buildi...-Editor-Part-1/


--------------------
I'm so fast that last night I turned off the light switch in my hotel room and was in bed before the room was dark - Muhammad Ali.
Peg jeżeli chcesz uprawiać sex to dzieci muszą wyjść, a jeżeli chcesz żeby był dobry ty też musisz wyjść - Al Bundy.

QueryBuilder, Mootools.net, bbcradio1::MistaJam
http://www.phpbench.com/
Go to the top of the page
+Quote Post
programista28
post 31.05.2012, 13:23:52
Post #10





Grupa: Zarejestrowani
Postów: 88
Pomógł: 2
Dołączył: 14.05.2011

Ostrzeżenie: (0%)
-----


Skowron ten przykład jest dla Internet Explororera przeczytałem cały artykuł i wykonałem proste wysiwyg na jego podstawie smile.gif

z tego kodu wynikalo by ze rzeczywiscie obrazek wstawia sie do textarea tongue.gif (oczywiscie tak nie jest i calosc "obrabia" zapewne silnik przeglądarki smile.gif
zmieniłem tok myślenia i widzę że do textarea dodawany jest sam znacznik z którym skojarzony jest obraz który widzimy smile.gif

jednak interesowało by mnie coś takiego jak ten artykuł tylko dla mozilli Firefox smile.gif (jak ktoś ma coś takiego w zakładkach to bardzo proszę o rucenie linka smile.gif )

jednak jak kogoś interesuje temat dla IE to poniżej zamieszczam kod WYSIWYG dla IE smile.gif






  1. <html>
  2.  
  3. <head>
  4.  
  5. <title> Using execCommand to bold text </title>
  6.  
  7. <script type="text/css">
  8.  
  9. .butClass
  10.  
  11. {
  12.  
  13. border: 1px solid;
  14.  
  15. border-color: #D6D3CE;
  16.  
  17. }
  18.  
  19.  
  20. </script>
  21.  
  22.  
  23. <script language="JavaScript">
  24.  
  25.  
  26.  
  27.  
  28.  
  29.  
  30. function Init()
  31.  
  32. {
  33.  
  34. iView.document.designMode = 'On'; // włączamy tryb edycji designMode
  35.  
  36. }
  37.  
  38. function boldIt()
  39.  
  40. {
  41.  
  42. iView.document.execCommand('bold', false, null); // jest to funkcja pogrubienia zaznaczonego obszaru
  43.  
  44. }
  45. function doForeCol()
  46.  
  47. {
  48.  
  49. var fCol = prompt('Enter foreground color', '');
  50.  
  51.  
  52.  
  53. if(fCol != null)
  54.  
  55. iView.document.execCommand('forecolor', false, fCol);
  56.  
  57. }
  58. function selOn(ctrl)
  59.  
  60. {
  61.  
  62. ctrl.style.borderColor = '#000000';
  63.  
  64. ctrl.style.backgroundColor = '#B5BED6';
  65.  
  66. ctrl.style.cursor = 'hand';
  67.  
  68. }
  69.  
  70.  
  71. function doBold()
  72.  
  73. {
  74.  
  75. iView.document.execCommand('bold', false, null);
  76.  
  77. }
  78.  
  79. function doCenter()
  80.  
  81. {
  82.  
  83. iView.document.execCommand('justifycenter', false, null);
  84.  
  85. }
  86.  
  87. function doBulList()
  88.  
  89. {
  90.  
  91. iView.document.execCommand('insertunorderedlist', false, null);
  92.  
  93. }
  94.  
  95.  
  96. function doLink()
  97.  
  98. {
  99.  
  100. iView.document.execCommand('createlink');
  101.  
  102. }
  103. function doImage()
  104.  
  105. {
  106.  
  107. var imgSrc = prompt('Enter image location', '');
  108.  
  109.  
  110.  
  111. if(imgSrc != null)
  112.  
  113. iView.document.execCommand('insertimage', false, imgSrc);
  114.  
  115. }
  116.  
  117.  
  118.  
  119. function doRule()
  120.  
  121. {
  122.  
  123. iView.document.execCommand('inserthorizontalrule', false, null);
  124.  
  125. }
  126.  
  127. function doFont(fname)
  128.  
  129. {
  130.  
  131. if (fname!='')
  132.  
  133. iView.document.execCommand ("fontname", false, fname);
  134.  
  135. }
  136.  
  137.  
  138.  
  139.  
  140.  
  141.  
  142.  
  143.  
  144.  
  145. </script>
  146.  
  147. <body onLoad="Init()"> <!-- wywolujemy funkcje Init poleceniem onLoad (przy wczytaniu strony uruchamia sie funkcja -->
  148.  
  149. <iframe id="iView" style="width: 600px; height:370px"></iframe> <!-- iframe funkcja init wlącza designMode tryb edycji -->
  150.  
  151. <br><br>
  152.  
  153. <input type="button" onClick="boldIt()" value="Toggle Bold"> <!-- przycisk ktory jest uruchamiany wywoluje fukcje boldIt() -->
  154. <input type="button" onClick="doForeCol()" value="kolor tekstu">
  155.  
  156. <img alt="Bold" class="butClass" src="bold.gif" onMouseOver="selOn(this)" onMouseOut="selOff(this)" onMouseDown="selDown(this)" onMouseUp="selUp(this)" onClick="doBold()">
  157. Read more at <a href="http://www.devarticles.com/c/a/HTML/Building-a-WYSIWYG-HTML-Editor-Part-1/3/#KkT3M3pCHeCqfOkR.99" target="_blank">http://www.devarticles.com/c/a/HTML/Buildi...M3pCHeCqfOkR.99</a>
  158.  
  159.  
  160. <input type="button" onClick="doLink()" value="twórz hiperłącze"></input>
  161. <input type="button" onClick="doImage()" value="wstaw zdjecie"></input>
  162. <input type="button" onClick="doRule()" value="wstaw linie"></input>
  163. <select name="selFont" onChange="doFont(this.options[this.selectedIndex].value)">
  164. <option value="1" >1</option>
  165. <option value="2" >2</option>
  166. <option value="3" >3</option>
  167. <option value="4" >4</option>
  168. <option value="5" >5</option>
  169. </select>
  170.  
  171. </body>
  172.  
  173. </html>
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 8.05.2025 - 04:41