كيفية اقتطاع النص حتى يتم النقر على رابط "المزيد"؟

Question

لدي سلسلة طويلة من الفقرات وأرغب في اختصار كل منها إلى سطرين (50 حرفًا) وعندما تنقر على الرابط "المزيد" ستظهر الفقرة كاملة.

أنا أستخدم مكتبة النموذج الأولي والقضبان.

أرغب بشكل مثالي في القيام بذلك دون تقسيم الفقرة إلى قسمين وإظهار الآخر عند النقر فوق المزيد.أم أن هذه هي الطريقة الوحيدة؟

Answer 1

هل لديك مشكلة مع يمتد؟ يبدو أن الطريقة الأكثر فعالية وضع هذا الأمر هو التفاف الزائدة في علامة خفية تمتد. يمكنك حتى التفاف كلها operationin أسلوب مساعد لطيفة لجعلها قابلة لإعادة الاستخدام.

وعلى افتراض النموذج:

def sample_with_more(body, html_options = {})
  more_link = link_to_function(" More...", "$('more').hide(); $('hidden').show();', :id => 'more')


  content_tag(:div, html_options) do 
    body[0..49] + more_link + 
      content_tag(:span, body[50..-1], :style => "display:none", :id => "hidden")
  end
end

Answer 2

ووضع النص في شعبة وتعيين الارتفاع إلى ارتفاع المطلوب (مع تجاوز: مخفي). عند النقر على رابط المزيد تعيين ارتفاع شعبة لdiv.scrollHeight. إذا كنت تستخدم مسج أو موتولز يمكنك رمي في الانتقال أنيق.

<div id="myText" style="overflow:hidden; height:50px;">Text here...</div>
<a href="javascript:;" onclick="showMore()">more</a>

<script type="text/javascript">
function showMore() {
    var mydiv = document.getElementById('myText');
    mydiv.style.height = mydiv.scrollHeight; 
}

// or with a transition (mootools)
function showMoreTransition() {
    new Fx.Tween($('myText'), {
        duration: 1000
    }).start('height', $('myText').getScrollHeight());
}
</script>

Answer 3

لأنني رجل jQuery، إليك بعض التعليمات البرمجية الزائفة

• حدد العنصر الذي يحتوي على ص
• حدد بعد أول 50 حرفًا وقم بتغليف div بفئة "نص أكثر"
• أدخل باستخدام Js بعد أ <button>more</button>
• أضف زر حدث النقر الذي يحدد display: block أو شيء أكثر نزوة على more-text
• قم بإزالة الزر أو قم بتغيير النص الخاص به إلى "أقل" وقم بتغيير الكود الضروري

Answer 4

والأجوبة المذكورة أعلاه تفترض أن ترسل النص الكامل لمتصفح، ثم ترك ذلك عرض سوى كمية معينة من ذلك عن طريق لقطة عموديا. هذا هو في الواقع فكرة جيدة، واقتطاع نص عفر مبلغ معين من الأحرف هو في الواقع ليس كما مستقيم إلى الأمام كما يبدو.

في مشروع في وقت مبكر، وكان لي قائمة طويلة من نصوص مبتورة ولا تريد أن ترسل لهم كل لمتصفح في الطول الكامل. والشيء المهم أن نأخذ في الاعتبار هنا هو إذا كان النص قد تحتوي على السيطرة أو الهروب حرفا (مثل HTML، ال BBCode، HTML-الكيانات، الخ) تحتاج إلى عناية خاصة عنهم.

وانتهى بي الأمر كتابة HTML العلامة صغير محلل لعدم تقديم علامات HTML التي قطعت في نصف، وإضافة علامات نهاية لمثل جريئة، مائل، الخ، ليست المسمار بقية تخطيط الشاشة.

وبالإضافة إلى ذلك، انها عادة ليس ما تريد - أي أنك لن تحصل على خطين بقيمة النص بعرض شاشة مختلفة أو عند وجود أحرف كسر خط في النص

.