Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

291
Views
¿Cómo contar el número de líneas en un artículo usando jQuery?

Disculpe, actualmente tengo un requisito, como el código que proporcioné ~

Necesito usar jquery para determinar cuántas líneas contiene el artículo original. Aunque actualmente se muestra en la pantalla con 2 líneas, es porque usé CSS para realizar la configuración, pero necesito saber cuántas líneas hay en el artículo original ~

Como soy principiante en la programación, no sé cómo hacerlo, espero poder obtener su ayuda, gracias

 .info{ font-size: 15px; letter-spacing:1px; line-height: 1.5; margin-bottom: 8px; letter-spacing:0; overflow:hidden; text-overflow:clip; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
 <div class="info">我是文章我是文章我是文章我是文章我是<br>文章我是文章我是文章我是文章我是文章我是文章我是文章我是文章我是<br>文章我是文章我是文章我是文章文章我是文章我是文章我是文章文章我是文章我是文章我是文章</div>

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Puede obtener la altura de un solo carácter dentro del contenedor y luego dividir la altura total del contenedor para obtener el número de líneas. Hice un ejemplo simple a continuación, no estoy familiarizado con la tipografía china, por lo que no puedo decir con seguridad si es una solución de prueba completa.

 $('#count').click(function() { var info = $('.info'); var divTemp = $('#temp'); divTemp.html(info.html()); var divChar = document.createElement('div'); divChar.innerText = '文'; info.prepend(divChar); var lineCount = Math.round(divTemp.height() / divChar.clientHeight); $('#result').text(lineCount); $(divTemp).html(''); $(divChar).remove(); })
 .info { font-size: 15px; letter-spacing: 1px; line-height: 1.5; margin-bottom: 8px; letter-spacing: 0; overflow: hidden; text-overflow: clip; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } #temp { font-size: 15px; letter-spacing: 1px; line-height: 1.5; margin-bottom: 8px; letter-spacing: 0; text-overflow: clip; display: -webkit-box; -webkit-box-orient: vertical; /* same as .info except the line clamp */ }
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="info">我是文章我是文章我是文章我是文章我是<br>文章我是文章我是文章我是文章我是文章我是文章我是文章我是文章我是<br>文章我是文章我是文章我是文章文章我是文章我是文章我是文章文章我是文章我是文章我是文章</div> <div id="temp"></div> <!-- .info and #temp should be under the same parent --> <span id="result"></span> <button id="count">Count</button>

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!