tutorial - uses of html




पाठ क्षेत्र में नई पंक्ति (7)

अन्य उत्तरों पर वर्णित पैटर्न का उपयोग करके मेरा .replace() फ़ंक्शन काम नहीं करता है। मेरे मामले के लिए काम करने वाला पैटर्न था:

var str = "Test\n\n\Test\n\Test";
str.replace(/\r\n|\r|\n/g,'
');

// str: "Test

Test
Test"
<textarea cols='60' rows='8'>This is my statement one.\n This is my statement2</textarea>

<textarea cols='60' rows='8'>This is my statement one.<br/> This is my statement2</textarea>

मैंने दोनों की कोशिश की लेकिन एचटीएमएल फाइल को प्रस्तुत करते समय नई लाइन प्रतिबिंबित नहीं हो रही है। मैं उसे कैसे कर सकता हूँ?


आप \n बजाय \n का उपयोग करना चाह सकते हैं।


इसे आज़माएं .. यह काम करता है:

<textarea id="test" cols='60' rows='8'>This is my statement one.&#10;This is my statement2</textarea>

के लिए बदल रहा है
टैग:

$("textarea#test").val(replace($("textarea#test").val(), "<br>", "&#10;")));

कई परीक्षणों के बाद, कोडक्रिप्ट में कोड मेरे लिए काम करता है

 export function ReplaceNewline(input: string) {
    var newline = String.fromCharCode(13, 10);
    return ReplaceAll(input, "<br>", newline.toString());
}
export function ReplaceAll(str, find, replace) {
    return str.replace(new RegExp(find, 'g'), replace);
}

दृश्य इंजन का उपयोग करते समय मुझे String.fromCharCode(13, 10) सहायक पाया गया है। https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode

यह इसमें वास्तविक न्यूलाइन वर्णों के साथ एक स्ट्रिंग बनाता है और इसलिए दृश्य इंजन को बच निकलने वाले संस्करण की बजाय एक नई लाइन आउटपुट करने के लिए मजबूर करता है। उदाहरण: नोडजेएस ईजेएस व्यू इंजन का उपयोग करना - यह एक साधारण उदाहरण है जिसमें किसी भी \ n को प्रतिस्थापित किया जाना चाहिए:

viewHelper.js

exports.replaceNewline = function(input) {
    var newline = String.fromCharCode(13, 10);
    return input.replaceAll('\\n', newline);
}

EJS

<textarea><%- viewHelper.replaceNewline("Blah\nblah\nblah") %></textarea>

renders

<textarea>Blah
blah
blah</textarea>

सबको बदली करें:

String.prototype.replaceAll = function (find, replace) {
    var result = this;
    do {
        var split = result.split(find);
        result = split.join(replace);
    } while (split.length > 1);
    return result;
};

मुझे लगता है कि आप विभिन्न भाषाओं के वाक्यविन्यास को भ्रमित कर रहे हैं।

  • &#10; है (एएससीआईआई 10 का एचटीएमएल एनकोडेड वैल्यू) या एचटीएमएल स्ट्रिंग में लाइनफीड कैरेक्टर शाब्दिक। यह HTML में लाइन ब्रेक के रूप में प्रस्तुत नहीं करता है (नीचे नोट्स देखें)।

  • \n एक जावास्क्रिप्ट स्ट्रिंग में लाइनफीड वर्ण शाब्दिक (ASCII 10) है।

  • <br/> HTML में एक लाइन ब्रेक है। कई अन्य तत्व, जैसे <p> , <div> , आदि कुछ शैलियों के साथ ओवरराइड किए जाने तक लाइन ब्रेक भी प्रस्तुत करते हैं।

उम्मीद है कि निम्नलिखित illustration इसे स्पष्ट कर देगा:

T.innerText = "Position of LF: " + t.value.indexOf("\n");

p1.innerHTML = t.value;
p2.innerHTML = t.value.replace("\n", "<br/>");
p3.innerText = t.value.replace("\n", "<br/>");
<textarea id="t">Line 1&#10;Line 2</textarea>

<p id='T'></p>
<p id='p1'></p>
<p id='p2'></p>
<p id='p3'></p>

एचटीएमएल के बारे में कुछ अंक ध्यान दें:

  • TEXTAREA तत्व की VALUE विशेषता HTML को प्रस्तुत नहीं करती है
  • P तत्व एक ही स्थान के रूप में सभी संगत सफेद रिक्त स्थान (नई लाइनों सहित) प्रस्तुत करता है।
  • एलएफ चरित्र एचटीएमएल में एक नई लाइन या लाइन ब्रेक में प्रस्तुत नहीं करता है।
  • TEXTAREA एलएफ को एक नई लाइन के रूप में प्रस्तुत करता है।

<textarea cols='60' rows='8'>This is my statement one.

This is my statement2</textarea>

यह दिखाता है कि यह काम करता है: http://jsfiddle.net/trott/5vu28/

यदि आप वास्तव में स्रोत फ़ाइल में एक पंक्ति पर होना चाहते हैं, तो आप एक पंक्ति फ़ीड के लिए एचटीएमएल चरित्र संदर्भ और एक कैरिज रिटर्न डाल सकते हैं जैसा कि @ बाकुडन से उत्तर में दिखाया गया है:

<textarea cols='60' rows='8'>This is my statement one.&#13;&#10;This is my statement2</textarea>






html