2015-07-16 8 views
-3

Я хочу, чтобы заменить текст с IMG, используя часть себя:Jquery + (Regex?) Заменить текст с Img из строки

<li class='custom'> 
<legend>images:</legend> 
{[img.png][1desc][2desc]} {[img2.png][1desc2][2desc2} 
</li> 

Я хочу, чтобы появиться как это:

<li class='custom'> 
<legend>images:</legend> 
<img src="img.png" title="1desc - 2desc"/> <img src="img2.png" title="1desc2 - 2desc2"/> 
</li> 

Текущий код, я использую (не работает):

<script> 
function textToImg(theImg) { 
    return theImg.replace(
      /\{\s*[\s*(.*?)\s*]\s*[\s*(.*?)\s*]\s*[\s*(.*?)\s*]\s*\}/gi, 
      '<img src="$1" title="$2 - $3"/>' 
     ); 
} 

jQuery('li.custom').each(function() { 

    current = jQuery(this); 

    IMG = textToImg(current.html()); 

    current.html(IMG); 

}); 
</script> 
+0

Является ли текст "строка" в сНу # строку вручную редактируемые? Я имею в виду: можете ли вы действительно гарантировать, что синтаксис, приведенный в примере, всегда будет соблюден? – cars10m

+0

Строка сама по себе полностью редактируема, поэтому кто-то может испортить синтаксис, хотя это и является наименьшим из моих забот. – Density

+1

Вам действительно нужно сделать попытку самостоятельно. Ожидание полного парсера bbCode в качестве вопроса, когда никакая попытка не была сделана, слишком широк. Если вы сделали попытки, отправьте этот код – charlietfl

ответ

0

я не сделал немного JQuery, так как я был строить свое решение на моем довольно старом IPOD, но Часть RegExp сделает трюк.

Сначала я собрал небольшую полезную функцию rall(r,s), которая применит метод RegExp exec(s) несколько раз на регулярном выражении r. Функция вернет массив массивов, каждый из которых имеет структуру [whole match,capture1,capture2,capture3,...].

Регулярного выражения строка был составлен из трех подразделов t (обратите внимание на двойной \: один из них всегда съедаются в струнное время генерации), а затем превратился в регулярное выражение с помощью new RegExp(string, flags).

Использование методов JavaScript Array map() и join() В конце концов я превратил его в строку, которую я сохранил в исходной строке s (см. Вывод консоли).

var t,r,s='{[img.png][name1][desc1]} {[img2.png][name2][desc2]}'; 

function rall(r, s) { // utility: apply r.execs(s) multiple times 
var a=[],t,g=r.global; 
do {t=r.exec(s);if (!t) break; 
    a.push(t);} while (g); 
return a; 
} 

t='\\s*\\[\\s*(.*?)\\s*\\]'; 
r=new RegExp('\\{'+t+t+t+'\\s*\\}','g'); 
s=rall(r,s).map(function(f){ 
return '<img src="'+f[1]+'" title="'+f[2]+'">'+f[3]; 
}).join('<br>\n'); 
console.log(s); 

Только что заметил, что я настроил свой результат немного иначе, чем ваш. Я оставляю это для вас, чтобы это правильно. ;-)

Редактировать

Сыграв вокруг моей маленькой функции полезности и получить его на работу была одна вещь ...

Но - используя регулярное выражение сверху (здесь: Выписали непосредственно)

r=\{\s*\[\s*(.*?)\s*\]\s*\[\s*(.*?)\s*\]\s*\[\s*(.*?)\s*\]\s*\}/g; 

вы можете сделать все это также с помощью только один String.replace() вызова:

s.replace(r,'<img src="$1" title="$2 - $3">'); 

Это произведет

<img src="img.png" title="name1 - desc1"> <img src="img2.png" title="name2 - desc2"> 
+0

Спасибо! Прекрасно работает – Density

Смежные вопросы