Отсутствие разрывов строк при доступе к опциям из поля выбора (html) через JavaScript - PullRequest
Новая
       7

Отсутствие разрывов строк при доступе к опциям из поля выбора (html) через JavaScript

2 голосов
/ 25 ноября 2010

У меня есть следующий код (очищенный код для ясности): 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript">
            function updateTextBox()
            {
                var lstSource = document.getElementById("lstSource");
                var details = lstSource[lstSource.selectedIndex].text;
                document.getElementById("txtDetails").value = details;
            }
        </script>
    </head>
    <body>
        <select id="lstSource" onChange="updateTextBox();">
            <option value="26">My Text

has a line break!</option>
        </select>
        <textarea id="txtDetails"></textarea>
    </body>

    </html>

Теперь, когда я нажимаю на элемент в поле выбора, я хотел бы, чтобы разрывы строк появлялись в текстовой области, однако, они просто не появляются.Я проверил в отладчике при заполнении элемента управления select, и разрывы строк определенно есть (и они также отображаются во всплывающей подсказке, когда я использую свойство title с тем же текстом).

Когда я отлаживаю код JavaScript и смотрю на фактические данные, содержащиеся в деталях переменной (используя charCodeAt), тогда я вижу, что нет разрывов строк, то есть между «My Text» и «есть строка»break "это только пробел (код 32).

У кого-нибудь есть идеи, можно ли это исправить, или мне придется жить с таким (на мой взгляд) ошибочным поведением?Может быть, я что-то упустил ...

Заранее спасибо

G.

Ответы [ 2 ]

0 голосов
/ 25 ноября 2010

Поскольку HTML сворачивает пробелы, включая символы новой строки, вы должны сделать еще один атрибут в списке параметров, чтобы сохранить текст с пробелами и символом новой строки

пример: 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
        <script type="text/javascript"> 
            function updateTextBox() 
            { 
                var lstSource = document.getElementById("lstSource"); 
                var details = lstSource[lstSource.selectedIndex].tmpText; 
                document.getElementById("txtDetails").value = details; 
            } 
            function onLoad() 
            { 
                var lstSource = document.getElementById("lstSource");
                var text = "Test +\n ";
                for(var i=0;i<lstSource.options.length;i++)
                {
                    lstSource.options[i].text = text +i;
                    lstSource.options[i].tmpText = text +i;
                }                
            } 
        </script> 
    </head> 
    <body onload="onLoad()" > 
        <select id="lstSource" onChange="updateTextBox();"> 
            <option></option>
            <option></option> 
            <option></option>
            <option></option> 
            <option></option>
            <option></option> 
        </select> 
        <textarea id="txtDetails" ></textarea> 
    </body> 

    </html>
0 голосов
/ 25 ноября 2010

HTML сворачивает пробел , включая символы новой строки.

Вместо этого вы можете использовать <br> элементов, но они не работают внутри <option> элементов. Итак, я боюсь, что вы хотите достичь не возможно с HTML ...

...