Нужна помощь с textarea
Есть div и его содержимое переносится из textarea по keyup. Беда в том что из textarea не правильно переносятся переносы строк. Я решил чтоб при нажатии "Enter" в див записывался тег "<br />". Но не могу правильно реализовать... Хелп!!!
<textarea id="textarea1"></textarea> <div id="div1"></div> $('#textarea1').keyup(function (e) { var txt = $(this).val() if(e.keyCode==13) { $('#div1').html(txt + '<br />'); }else{$('#div1').html(txt);} }); Этот скрипт вставляет <br /> но после следующего нажатия на любую клавишу тег исчезает... p.s. Не желательно чтоб <br /> отображался в textarea |
Цитата:
http://javascript.ru/String/replace |
Вы наверно не так поняли... Или я ))
При переносе из текстареи в диве текст отображается в одну строку, не смотря на то что в текстарее он в несколько строк... Эту проблему я и пытаюсь решить, но не желательно просто в текстарею заносить тег BR, т.к. будет не очень хорошо это смотреться |
Цитата:
|
Если Вы имеете в виду див с contentEditable=true, то он как-то работает не понятно... Если пустой то курсор не ставится, только если какой-нибудь текст есть...
|
Что-то типа такого...
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('button').click(function (){ var val=$('textarea').text(); val=val.replace(/\r/g,'<br />') $('div').html(val); }); }); </script> </head> <body> <textarea></textarea> <button>get</button> <div></div> </body> </html> |
Цитата:
|
Цитата:
|
|
Цитата:
Вот такой вариант работает и там, и там <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('textarea').keyup(function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); }); </script> </head> <body> <textarea></textarea> <div></div> </body> </html> |
Все заработало!!!!!!!!!!!!!:dance:
Спасибо огромное)) |
Чет плюс не добавляется, пишет "Вы должны добавить отзыв кому-то еще"..
|
Цитата:
|
И еще маленький вопросик))
Как сделать обратно replace(/\n/g,'<br />') Так ?? replace('<br />',/\n/g) |
replace(/<br \/>/g,'\n')
По идее , при выделении курсором контента должно само вставить Пример копирования из топика Цитата:
|
Цитата:
|
var text = elem.html(); text = text.replace('<br />',/\n/g); $('#textarea1').val(text); Так не работает |
Само не хочет... Пишет в одну строку
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('textarea').bind('keyup mouseup mouseleave',function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); }); </script> </head> <body> фывфывфыв<br> фывфывфыв<br> <br> <textarea></textarea> <div></div> </body> </html> Не наю = у меня вставляется |
Если скопировать и вставить то норм...Но у меня на клик по диву должно вставляться в текстарею тоже...
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('div').click(function (){ var text = $(this).html(); text = text.replace('<br />',/\n/g); $('textarea').val(text); }); $('textarea').bind('keyup mouseup mouseleave',function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); }); </script> </head> <body> <br> <textarea></textarea> <div>Текст</div> </body> </html> Изначально текст есть в диве.... Он редактируется через текстарею... |
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('textarea').bind('input keyup mouseup mouseleave',function (e) { var val = this.value; val=val.replace(/\n/igm,'<br />') $('#insert2').html(val); }); $('#insert').click(function () { var s=$('#insert').html().replace(/<br[^>]*>/g,''); $('textarea').val(s); }); }); </script> </head> <body> <div id="insert"> фывфывфыв<br> фывфывфыв<br> </div> <br> <textarea></textarea> <div id="insert2"> фывфывфыв<br> фывфывфыв<br> </div> </body> </html> |
Спасибо... Ноя я тут сам нарыл)))
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('div').click(function (){ var text = $(this).html(); text = text.replace(/<br>/g, ' \n'); $('textarea').val(text); }); $('textarea').bind('keyup mouseup mouseleave',function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); }); </script> </head> <body> <br> <textarea></textarea> <div>Текст</div> </body> </html> Так все работает... Еще раз спасибо Вам за помощь... |
Цитата:
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('textarea').keyup(function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); $('div').click(function (e) { var val = $('div').html(); val=val.replace(/(<BR>)|(<br>)/g,'\n') alert(val); $('textarea').val(val); }); }); </script> </head> <body> <textarea></textarea> <div></div> </body> </html> |
.replace(/<br[^>]*>/igm,'');
Написание <br> <br/> <br /> поправил |
Цитата:
|
:) Совсем забыл про ишака:(
replace(/(<BR>)|(<br>)/g,'\n') - это сработало. |
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> $(document).ready(function (){ $('div').click(function (){ var text = $(this).text(); if('\v'=='v' ){text=$(this).html().replace(/<br[^>]*>/igm,'\n');} $('textarea').val(text); }); $('textarea').bind('keyup mouseup mouseleave',function (e) { var val = this.value; val=val.replace(/\n/g,'<br />') $('div').html(val); }); }); </script> </head> <body> <br> <textarea rows=7></textarea> <br> <br> <br> <div> Текст<br> Текст<br> Текст<br> </div> </body> </html> Цитата:
|
Цитата:
|
Torch`Ok,
:) Какой браузер? (Только в ИЕ и выстраивается ... Ща |
Поправил пост 26
|
Опера у меня.. И все равно выстраивает в одну строку....
replace(/(<BR>)|(<br>)/g,'\n') - так а чем тебе этот способ не нравится??? Работает во всех браузерах. |
Torch`Ok,
У меня в свежей опере - лишние пробелы с добавкой replace Протести в иных браузах |
Часовой пояс GMT +3, время: 08:33. |