बूटस्ट्रैप पॉपओवर छुपाता लाइन

टूट जाता है बूटस्ट्रैप पॉपओवरबूटस्ट्रैप पॉपओवर छुपाता लाइन

<a data-original-title="" data-content="Hi, 
      Welcome ! 

      Sincerely, 
      programmer 
      " 
    data-placement="bottom"> 
    content 
</a>

दिखाने के लिए इस प्रकार है और मैं पॉपओवर प्रारंभ के रूप में इस प्रकार है

$(this).popover({ 
      html:true 
     });

सभी ठीक काम करता है, लेकिन समस्या यह है के रूप में मैं एचटीएमएल कोड का उपयोग कर रहा डेटा-सामग्री में उपलब्ध सामग्री रिक्त स्थान के साथ प्रदर्शित नहीं होती .... यह सभी नई लाइनों को हटा देती है और इसे एक पंक्ति में दिखाती है .... मैं इसे कैसे दूर कर सकता हूं ....

स्रोत

2013-01-22 Aravind

अरुण उल्लेख किया है, आप में HTML का उपयोग करना होगा डेटा-सामग्री विशेषता। यदि आपको विशेषताओं के अंदर विशेषताओं का उपयोग करने की आवश्यकता है, तो बस एकल उद्धरणों का उपयोग करें। – isherwood

आपकोका उपयोग करने की आवश्यकता है एचटीएमएल में नई लाइन के लिएया <pre> टैग

स्रोत

2013-01-22 13:30:40

+57

यह 'data-html =" true "' – daVe

के बिना काम नहीं करता है, बहुत बहुत धन्यवाद:) – mohammad

प्रारूपण में लाइन ब्रेक को संरक्षित करने के लिए आप white-space: pre-wrap; का उपयोग कर सकते हैं। मैन्युअल रूप से HTML तत्वों को सम्मिलित करने की कोई आवश्यकता नहीं है।

.popover { 
    white-space: pre-wrap;  
}

स्रोत

2014-11-21 09:57:59 AncientSyntax

यह शानदार है और इसे और अधिक अपवर्तक की आवश्यकता है। मुझे 'प्री-रैप' विकल्प से अवगत नहीं था। – mcNux

यह पाठ के भीतर कई आसन्न रिक्त स्थान भी संरक्षित करता है। 'व्हाइट-स्पेस: प्री-लाइन' केवल लाइन ब्रेक को सुरक्षित रखता है। – qbert220

अरुण पी जॉनी के समाधान के लिए पर जोड़ने के लिए, यदि आप पाते हैं कि data-content मूल्य में अपने <br /> टैग पृष्ठ पर पॉपओवर सामग्री में सादे पाठ के रूप प्रदान कर रहे हैं,, अतिरिक्त विशेषता data-html="true" जोड़ें ताकि तरह:

<a data-content="Hi,<br />Welcome !<br /><br />Sincerely,<br />programmer" 
     data-html="true" 
     data-placement="bottom"> 
    content 
</a>

ध्यान रखें कि data-html="true" का उपयोग XSS attacks पर संभावित भेद्यता का परिचय देता है; अवांछित उपयोगकर्ता इनपुट के साथ इसका उपयोग न करें।

डॉक्स:

.popover { 
    white-space: pre-line;  
}

के लिए धन्यवाद: https://getbootstrap.com/docs/3.3/javascript/#popovers-options

स्रोत

2015-01-06 14:52:42

मैं अपने स्टाइलशीट के लिए निम्न मेरी पॉपओवर पाठ जहाँ मैं लाइनों को तोड़ने के लिए चाहते हैं \ N जोड़ने और जोड़कर इस काम कर पाने में कामयाब रहे मदद करो, हर कोई!

स्रोत

2015-07-22 07:41:26

हम सफेद-स्थान की स्टाइल का उपयोग करने में कामयाब रहे: प्री-रैप को छोड़कर हमने पाया कि पूरे पॉप-ओवर में अतिरिक्त सफेद जगह जोड़ा गया है। इसके बजाए हमने इस स्टाइल को पॉपओवर-सामग्री में जोड़ा।

.popover-content { 
    white-space: pre-wrap; 
}

स्रोत

2016-02-02 22:29:29 cmejet

हां, यह सही जवाब है! धन्यवाद! – EstebanGarciaAlonso

तुम बस जोड़ने की जरूरत है डेटा-एचटीएमएल = अपने टैग में "सही" तो सहायता पाठ काम ठीक अंदर सभी अपने html टैग,

स्रोत

2016-11-24 10:08:44

उत्तर

संबंधित मुद्दे