Автоформат, нужна помощь.
Появилась такая идея/надобность - автоформатирование поступающего текста. Тоесть текст изначально идет сплошным потоком, типа:
"Это пробный текст.Переносов по строкам нету.Выделений по шрифтам нету. Списков нету:хотя это был бы 1; Это 2;Этопоследний;." Так вот собственно мысль сделать так чтобы скрипт переформировал этот текст в: "Это пробный текст. Переносов по строкам нету. Выделений по шрифтам нету. Списков нету:
Знаки: "." - перенос строки ":" - начало списка ";" - элемент списка ";." - конец списка Хотя бы так пока что. Вот что у меня есть. (с последних изменений работать перестало) <div id="to"><span id="tospan">!!!!!!</span></div> <input type="submit" value="CHECK" id="check">
<script language="JavaScript" type="text/javascript">
$( "#check" ).click(function(){
var i = 0;
var current_txt='';
var txt = 'ЭТО ПЕРВАЯ СТРОКА. ЭТО ВТОРАЯ СТРОКА.Это голова списка:Список1;Список2;Список3;.Надеюсь это соседним блоком пойдет уже.';
alert(txt);
var N = txt.replace(/[^.]/g,"").length;
alert(N);
for (var i = 0; i < N; i++) {
var txt_i=txt.split('.')[i];
var N_listheader = txt_i.replace(/[^:]/g,"").length;
alert(N_listheader);
alert("Text:"+ current_txt);
for (var k = 0; k <= N_listheader; k++) {
var txt_list_head=txt_i.split(':')[0];
var txt_list_content=txt_i.split(':')[1];
N_listcontent = txt_list_content.replace(/[^;]/g,"").length;
for (var s = 0; s<=N_listcontent; s++)
{
var txt_list_contentlocal=txt_list_content.split(':')[s];
txt_list_content = "<li>"+txt_list_contentlocal"</li>";
}
if(k>0)
{
current_txt = current_txt+txt_list_head+":<ul>"+txt_list_content;
alert("Adding Listhead:");
alert("Text:"+ current_txt);
}
else
{
current_txt= current_txt+txt_i+"<br>";
alert("Adding normal text");
alert("Text:"+ current_txt);
}
}
}
$( '#tospan' ).html(current_txt);
return false;
});
</script>
Было бы еще хорошо например если более Х точек, делать двухколоночный. То есть заносить в другой блок, или ячейку таблицы. |
Пример парсера. По идее можно сколь угодно усложнять и развивать форматирование, в отличие от твоего метода. Я тут сразу строю DOM, но можно просто формировать HTML, а дальше скормить браузеру через innerHTML.
Недостатки: громоздко (но вроде вполне все ясно), не быстро (посимвольный просмотр).
<body>
<script>
function Parser() {
this.fragment = document.createDocumentFragment();
this.buffer = '';
}
Parser.prototype.State = {
IN_TEXT: 0,
IN_LIST: 1
};
Parser.prototype.parse = function(text) {
var state = this.State.IN_TEXT;
for (var i = 0; i < text.length; i++) {
var c = text.charAt(i);
switch (state) {
case this.State.IN_TEXT:
if (c == '.') {
this.fragment.appendChild(this.createNodeFromBuffer('text'));
this.fragment.appendChild(this.createNode('break'));
} else if (c == ':') {
this.fragment.appendChild(this.createNodeFromBuffer('list-header'));
this.fragment.appendChild(this.createNode('list'));
state = this.State.IN_LIST;
} else {
this.buffer += c;
}
break;
case this.State.IN_LIST:
if (c == '.') {
state = this.State.IN_TEXT;
} else if (c == ';') {
var list = this.fragment.childNodes[this.fragment.childNodes.length -1];
list.appendChild(this.createNodeFromBuffer('list-item'));
} else {
this.buffer += c;
}
break;
}
}
return this.fragment;
};
Parser.prototype.createNodeFromBuffer = function(type) {
var content = this.buffer;
this.buffer = '';
return this.createNode(type, content);
};
Parser.prototype.createNode = function(type, content) {
switch (type) {
case 'text':
return document.createTextNode(content);
case 'break':
return document.createElement('br');
case 'list-header':
var element = document.createElement('strong');
element.appendChild(document.createTextNode(content));
return element;
case 'list':
return document.createElement('ul');
case 'list-item':
var element = document.createElement('li');
element.appendChild(document.createTextNode(content));
return element;
}
};
// юзание:
var string = "Это пробный текст.Переносов по строкам нету.Выделений по шрифтам нету. Списков нету:хотя это был бы 1; Это 2;Этопоследний;.";
document.body.appendChild(new Parser().parse(string));
</script>
</body>
|
Спасибо, вполне подходит и этот вариант.
Только никак что-то не получается сделать привязку к кнопке и конкретному элементу. Ну как было в моем коде - нажимаешь кнопку, текст вставляется отформатированный в окно блока. |
А, все, тупил, не тот файл открыт был)
вот так сделал:
$( "#check" ).click(function(){
$('#tospan').html(new Parser().parse(string));
});
|
А разве $(el).append(fragment) не работает?
|
| Часовой пояс GMT +3, время: 06:08. |