2016-08-10 2 views
0

Я код, который я сделал некоторое время назад показано ниже:Вставить текст в каре - вставить новые строки и вкладки пространства

selected = ''; 
 

 
$('img').click(function(){ 
 
    console.log($(this).attr('alt')); 
 
\t selected = $(this).attr('alt'); 
 
}); 
 

 
$('#comments').click(function(){ 
 
\t insertAtCaret('comments',selected) 
 
    // Clear the selection so it isn't copied repeatedly 
 
    selected = ''; 
 
}); 
 

 
function insertAtCaret(areaId,text) { 
 
    var txtarea = document.getElementById(areaId); 
 
    var scrollPos = txtarea.scrollTop; 
 
    var strPos = 0; 
 
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
 
     "ff" : (document.selection ? "ie" : false)); 
 
    if (br == "ie") { 
 
     txtarea.focus(); 
 
     var range = document.selection.createRange(); 
 
     range.moveStart ('character', -txtarea.value.length); 
 
     strPos = range.text.length; 
 
    } 
 
    else if (br == "ff") strPos = txtarea.selectionStart; 
 

 
    var front = (txtarea.value).substring(0,strPos); 
 
    var back = (txtarea.value).substring(strPos,txtarea.value.length); 
 
    txtarea.value=front+text+back; 
 
    strPos = strPos + text.length; 
 
    if (br == "ie") { 
 
     txtarea.focus(); 
 
     var range = document.selection.createRange(); 
 
     range.moveStart ('character', -txtarea.value.length); 
 
     range.moveStart ('character', strPos); 
 
     range.moveEnd ('character', 0); 
 
     range.select(); 
 
    } 
 
    else if (br == "ff") { 
 
     txtarea.selectionStart = strPos; 
 
     txtarea.selectionEnd = strPos; 
 
     txtarea.focus(); 
 
    } 
 
    txtarea.scrollTop = scrollPos; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#!"><img src="smiley1.png" alt="{smiley001}"><img src="smiley2.png" alt="{smiley002}"><img src="smiley3.png" alt="{smiley003}"><img src="smiley4.png" alt="{smiley004}"><img src="smiley5.png" alt="{smiley005}"></a><br> 
 
<textarea id="comments" cols="50" rows="10"></textarea>

В этом коде, вы нажимаете на картинке и затем вы нажимаете на пробел в текстовом поле, а атрибут alt изображения вставлен в положение каретки.

Я хочу вставить вкладки и новые строки для некоторых изображений, поэтому какие значения я бы добавил для атрибутов alt соответствующих изображений?

ответ

0

Если я правильно понимаю, вы пытаетесь добавить форматирование текста на основе пробелов в атрибут alt. Я не думаю, что это возможно, он будет преобразован в пробелы браузером. Вы можете добавить data- attribute, чтобы справиться с этим.

+0

Что я вставляю в атрибут данных для пробелов? –

+0

, например, исходный текст с urlencoded (с вкладками или новыми строками), что вы можете установить urldecode при вставке. Таким образом, вы не будете нарушать UI/UX или действительность Html. – balint

+0

спасибо, что это действительно полезно :) –

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

  • Нет связанных вопросов^_^