Vložení htm kodu do textarea

Fórum › JavaScript, AJAX, jQuery

JMM

~ Redaktor

Grafoman

Kultivátor příspěvků ve starém fóru – 9.04 % z celku

1. 7. 2010 #1

Ahoj, potřeboval bych vložit html kod do textarea přes odkaz ale netuším jak :-( Poradíte?

Nahlásit jako SPAM

IP: 217.29.14.–

Jan Malý | web: www.malyphoto.cz, @malyphoto

CZechBoY+4

Věrný člen

1. 7. 2010 #2

textarea.innerHTML? :D

Nahlásit jako SPAM

IP: 90.176.0.–

asdasd

~ Anonymní uživatel
~ 30 příspěvků

1. 7. 2010 #3

<!DOCTYPE

	html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

>

<html>

	<head>

		<meta

			http-equiv = "content/type"

			content    = "text/html; charset = utf-8"

		/>

		<script

			src  = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"

			type = "text/javascript"

		></script>

		<script>

			$(function() {

				$('a').click(function() {

					$('textarea').text(

						'<html>\n' +

						'  <body>\n' +

						'  </body>\n' +

						'</html>'

					);

				});

			});

		</script>

	</head>

	<body>

		<textarea></textarea>

		

		<a href="#">vložit</a>

	</body>

</html>

Nahlásit jako SPAM

IP: 83.240.95.–

marioff0

Expert

1. 7. 2010 #4

len taka rychlovka co ma napadla, hadam to pojde:

<textarea id="textak"></textarea> 

<span onclick="document.getElementById('textak').value='bla bla';">vloz text</span>

Nahlásit jako SPAM

IP: 195.78.44.–

Škoda, že život sa nedá "sejvovať", tak že by som po zlom životnom rozhodnutí mohol začať odznova :([br] Lenivosť je matka pokroku.[br][br] http://cut.sk/ - odstrihni si dlhý link

JMM

~ Redaktor

Grafoman

2. 7. 2010 #5

To asdasd : tohe řešení se mi moc líbí, jen mám problém že to přepíše veškerý obsah co tam již je. Dalo by se to nějako upravit aby se to přidalo buď na konec a nebo na místo kurzoru?

A ještě jeden problém vznikl. Pokud do textarea něco napíšu, už to tam nechce vkládat ten kod

EDIT: Problémy opraveny. Pro pořádek zde dávám na ukázku kod

<script>

      $(function() {

            $('a.code1').click(function() {

              var areaValue = $('#ArtContent').val();

              $('#ArtContent').val(areaValue + 

              '<div class="trida">\n' +

              '  <img src="obrazek" width="500" height="250" alt="" />\n' + 

              '  <p>Lorem lipsum</p>\n' +

              '</div>'

                );

            });

            

            $('a.code2').click(function() {

              var areaValue = $('#ArtContent').val();

              $('#ArtContent').val(areaValue + 

                '<p>\n' +

                'nejaky text\n' +

                '</p>'

                );

            });

      });

</script> 



  <textarea name="nazev" id="ArtContent" rows="15" ></textarea>

  <a class="code1" href="#">code 1</a>

  <a class="code2" href="#">code 2</a>

Nahlásit jako SPAM

IP: 89.111.99.–

Jan Malý | web: www.malyphoto.cz, @malyphoto

asdasd

~ Anonymní uživatel
~ 30 příspěvků

2. 7. 2010 #6

Čau. Já bych to viděl spíš nějak takhle:



<!DOCTYPE

	html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

>

<html>

	<head>

		<meta

			http-equiv = "content/type"

			content    = "text/html; charset = utf-8"

		/>

		<script

			src  = "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"

			type = "text/javascript"

		></script>

		<script>

			$(function() {

				var html = {

					image:

						'<div class="trida">\n' + 

						'  <img src="obrazek" width="500" height="250" alt="" />\n' + 

						'  <p>Lorem lipsum</p>\n' + 

						'</div>',

					someText:

						'<p>\n' + 

						'  nejaky text\n' + 

						'</p>'

				};

				$('[class^=insert_]').click(function() {

					var

						options = $(this).attr('class').split('_'),

						what    = html[options[1]],

						$where  = $('#' + options[2]),						

						text    = $where.val(),

						text    = text ? text + '\n' : text;

					$where.val(text + what);

				});

			});

		</script>

	</head>

	<body>

		<textarea id = "target" rows = "15"></textarea>

		<a class = "insert_image_target" href = "#">Vložit obrázek</a>

		<a class = "insert_someText_target" href = "#">Vložit nějaký text</a>

	</body>

</html>