jQuery লাইন বিরতি বিআর রূপান্তর (nl2br সমতুল্য)

Question

আমি jQuery করছি কিছু টেক্সটরিয়া সামগ্রী নিয়ে এবং এটি একটি লি মধ্যে sertোকান।

আমি এটি দৃশ্যত লাইন বিরতি ধরে রাখতে চান।

এটি করার সত্যিই একটি সহজ উপায় থাকতে হবে ...

Comments

এক্সএসএস নোট: আপনি যদি এটি করেন তবে মনে হয় আপনি সরাসরি ব্যবহারকারী ইনপুট এবং <br/> এর মিশ্রিত করছেন, যার অর্থ আপনি হয় নতুন লাইনগুলি প্রদর্শন করছেন বা <br/s>, এবং এটি এক্সএসএস আক্রমণে উন্মুক্ত হতে পারে এটি হ'ল যদি আপনার ইনপুটটি সাইটের কোনও অন্য ব্যবহারকারীর কাছ থেকে আসে।

— ব্যবহারকারী420667

Answer 1

ডেমো: http://so.devilmaycode.it/jquery-convert-line-breaks-to-br-nl2br- অভিজ্ঞ

function nl2br (str, is_xhtml) {   
    var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';    
    return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1'+ breakTag +'$2');
}

• http://phpjs.org/functions/nl2br:480

Comments

ধন্যবাদ এই নিখুঁতভাবে কাজ করে। আশ্চর্যের বিষয় কীভাবে এটি jQuery এর অফিসিয়াল ফাংশন নয়।

— gbhall

কারণ jQuery এর অর্থ জাভাস্ক্রিপ্ট ফাংশন প্রতিস্থাপনের মতো প্রতিস্থাপন করা নয়, এটি সিএসএস নির্বাচক চেইনিং এবং সহজ অ্যাক্সেসের উপর দৃষ্টি নিবদ্ধ করে! ভবিষ্যতের সংস্করণে হতে পারে ;-)

— লুকা ফিলোসোফি

অসাধারণ. আই -7 হোয়াইট স্পেসকে সমর্থন না করে সমস্যাটি কাটিয়ে উঠতে আমাকে সহায়তা করেছে: প্রাক-মোড়ক

— কেভিন পাওলি

সেই রেজেক্সের অর্থ কি যদি একটি লাইন ">" দিয়ে শেষ হয় এটি বিআর যুক্ত করে না? আমি জানি আমার এইচটিএমএল এ আমি & gt; তবে ব্যবহারকারী উত্পন্ন সামগ্রী এর সাথে এতটা ভাল কাজ করে না ...

— ডেভ স্টেইন

@ ডেভস্টাইন না, আমি '>' এবং '& gt' উভয় দিয়েই এটি চেষ্টা করেছি; এবং উভয় বার লাইন বিরতি যুক্ত করা হয়। আমি মনে করি এই ফাংশন কোডটি মূলত নিখুঁত :)

— জ্যাক

Answer 2

আপনি সহজভাবে করতে পারেন:

textAreaContent=textAreaContent.replace(/\n/g,"<br>");

Comments

চিয়ার্স, এই ধরণের কাজ করা বাদে এটি একক লাইন বিরতি হিসাবে একাধিক লাইন বিরতি হিসাবে বিবেচিত হবে।

— gbhall

আমি এটি আপডেট করেছি এবং এখন এটি একটি রেজিপ্যাক্স ব্যবহার করেছে সুতরাং আপনি যদি একাধিক লাইন বিরতি চিকিত্সা করতে চান তবে একক বিআর এর সাথে

— রেজিপ্যাক্স

ধন্যবাদ. আশা করি কেউ আপনার উত্তরটি দরকারী খুঁজে পেয়েছে তবে নীচের ফাংশনটিও কাজ করে। আমি আরও খারাপ লাগছে যে আপনি আরও চেষ্টা করছেন তবে একটি ফাংশনটি আরও আকাঙ্ক্ষিত।

— gbhall

যদি আপনি ভুল পান "x.replace কোন ফাংশন নয়" তাহলে x.toString () ব্যবহার প্রতিস্থাপন করুন।

— Vörös Amadea

Answer 3

এটি আপনার কোডে রাখুন (পছন্দসই একটি সাধারণ জেএস ফাংশন লাইব্রেরিতে):

String.prototype.nl2br = function()
{
    return this.replace(/\n/g, "<br />");
}

ব্যবহার:

var myString = "test\ntest2";

myString.nl2br();

স্ট্রিং প্রোটোটাইপ ফাংশন তৈরির সাহায্যে আপনি এটি কোনও স্ট্রিংয়ে ব্যবহার করতে পারবেন।

Answer 4

সামগ্রী পরিবর্তন করার পরিবর্তে রেন্ডারিং পরিবর্তন করার চেতনায় , নিম্নলিখিত সিএসএস প্রতিটি নিউলাইনকে এর মতো আচরণ করে :<br>

white-space: pre;
white-space: pre-line;

কেন দুটি নিয়ম: pre-lineকেবল নিউলাইনগুলি প্রভাবিত করে (ক্লুটির জন্য ধন্যবাদ, @ কেভিনপৌলি)। আই 6-- এবং অন্যান্য পুরাতন ব্রাউজারগুলি আরও চূড়ান্ত দিকে ফিরে যায় preযার মধ্যে nowrapএকাধিক স্পেস অন্তর্ভুক্ত থাকে এবং রেন্ডার হয়। মোজিলা এবং সিএসএস-ট্রিকগুলিতে এইগুলি এবং অন্যান্য সেটিংস ( pre-wrap) এর বিশদ (ধন্যবাদ @ সাবেলফোস্টে)।

আমি সাধারণত প্রশ্নের উত্তর না দিয়ে দ্বিতীয়-অনুমানের জন্য এসও প্রিলিফিকেশনটির বিরুদ্ধে থাকি , এই ক্ষেত্রে <br>মার্কআপের সাথে নিউলাইনগুলি প্রতিস্থাপন করা ধোয়া না দেওয়া ব্যবহারকারীর ইনপুট দিয়ে ইনজেকশন আক্রমণের ঝুঁকি বাড়িয়ে তুলতে পারে । আপনি যখনই নিজেকে .text()কলগুলি পরিবর্তন .html()করতে দেখেন যাতে আক্ষরিক প্রশ্নটি ইঙ্গিত দেয় তখন আপনি একটি উজ্জ্বল লাল রেখাটি অতিক্রম করছেন । (এই পয়েন্টটি হাইলাইট করার জন্য আপনাকে ধন্যবাদ @ অ্যালেক্সস।) আপনি যদি কোনও সুরক্ষা ঝুঁকির বিষয়টি অস্বীকার করেন, ভবিষ্যতের পরিবর্তনগুলি অজান্তেই এটি প্রবর্তন করতে পারে। পরিবর্তে, এই সিএসএস আপনাকে নিরাপদ ব্যবহার করে মার্কআপ ছাড়াই হার্ড লাইন বিরতি পেতে দেয় .text()।

Comments

কেসের উপর নির্ভর করে, এটিই সহজ সমাধান, এবং সত্যই উত্তরটির উত্তম। আপনি অন্যান্য white-space:বিকল্পগুলির মধ্যে যে কোনওটিকেও বিবেচনা করতে পারেন , যেমন pre-wrap। সিএসএস

— ট্রিক্স.

এটি সত্যই সেরা উত্তর - স্ট্রিং প্রতিস্থাপন সমাধানগুলির অর্থ .html()সামগ্রীটি সেট করার জন্য ব্যবহারের প্রয়োজন হবে , যার ফলে ব্যবহারকারীরা নির্বিচারে এইচটিএমএল সন্নিবেশ করতে দেয় আপনি যদি আগে থেকে এটি ফিল্টার না করেন।

— অ্যালেক্স এস

.html()বিপদ সম্পর্কে ভাল পয়েন্ট @ অ্যালেক্সস, অন্তর্ভুক্ত করার চেষ্টা করেছেন।

— বব স্টেইন

Answer 5

সমাধান

এই কোড ব্যবহার করুন

jQuery.nl2br = function(varTest){
  return varTest.replace(/(\r\n|\n\r|\r|\n)/g, "<br>");
};

Answer 6

এই জাভাস্ক্রিপ্ট ফাংশনটি অদলবদল পরিচালনা করতে sertোকানো বা প্রতিস্থাপন করা উচিত কিনা তা বিবেচনা করে।

(এইচটিএমএল লাইন ব্রেকগুলি সন্নিবেশ করুন বা প্রতিস্থাপন করুন)

/**
 * This function is same as PHP's nl2br() with default parameters.
 *
 * @param {string} str Input text
 * @param {boolean} replaceMode Use replace instead of insert
 * @param {boolean} isXhtml Use XHTML 
 * @return {string} Filtered text
 */
function nl2br (str, replaceMode, isXhtml) {

  var breakTag = (isXhtml) ? '<br />' : '<br>';
  var replaceStr = (replaceMode) ? '$1'+ breakTag : '$1'+ breakTag +'$2';
  return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, replaceStr);
}

ডেমো - জেএসফিডাল

জাভাস্ক্রিপ্ট nl2br এবং br2nl ফাংশন

Answer 7

আমি এর জন্য একটু jQuery এক্সটেনশন লিখেছি:

$.fn.nl2brText = function (sText) {
    var bReturnValue = 'undefined' == typeof sText;
    if(bReturnValue) {
        sText = $('<pre>').html(this.html().replace(/<br[^>]*>/i, '\n')).text();
    }
    var aElms = [];
    sText.split(/\r\n|\r|\n/).forEach(function(sSubstring) {
        if(aElms.length) {
            aElms.push(document.createElement('br'));
        }
        aElms.push(document.createTextNode(sSubstring));
    });
    var $aElms = $(aElms);
    if(bReturnValue) {
        return $aElms;
    }
    return this.empty().append($aElms);
};

Answer 8

@ লুকা ফিলোসফির গৃহীত উত্তরকে উন্নত করতে,

যদি প্রয়োজন হয় তবে এই /([^>[\s]?\r\n]?)রেজেক্সের প্রারম্ভিক ধারাটি পরিবর্তন করা সেই ক্ষেত্রে কেস ইনগ্রোর করবে যেখানে নতুন লাইন একটি ট্যাগের পরে আসে এবং কিছু শ্বেত স্পেসের পরিবর্তে কেবল একটি ট্যাগের সাথে সাথে একটি নতুন লাইনের পরে আসে

Answer 9

ডিওএম- এ টেক্সারিয়া থেকে পাঠ্য সন্নিবেশ করার আরেকটি উপায় লাইন বিরতি রেখে Node.innerText বৈশিষ্ট্যটি ব্যবহার করা যা কোনও নোড এবং এর বংশধরদের রেন্ডার করা টেক্সট সামগ্রী উপস্থাপন করে ।

গিটার হিসাবে, এটি কার্সারের সাহায্যে উপাদানগুলির বিষয়বস্তু হাইলাইট করে এবং ক্লিপবোর্ডে অনুলিপি করা হয় তবে ব্যবহারকারীরা যে পাঠ্যটি পাবেন তা সন্নিহিত করে।

সম্পত্তিটি 2016 সালে প্রমিত হয়ে উঠল এবং আধুনিক ব্রাউজারগুলি দ্বারা এটি সমর্থনযোগ্য। আমি কি ব্যবহার করতে পারি : আমি যখন এই উত্তরটি পোস্ট করি তখন 97% গ্লোবাল কভারেজ।