p段...在jquery不工作？

Question

嗨，我正在使用我的p標籤中的限制文字，但它僅適用於第一個和第三個p標籤。

如何應對全部p標籤？

$(document).ready(function(){ 
 
    
 
    if('.textSec'){ 
 
    
 
    var p=$('.textSec p'); 
 
\t \t var divh=$('.textSec').height(); 
 
\t \t while ($(p).outerHeight()>divh) { 
 
\t \t  $(p).text(function (index, text) { 
 
\t \t   return text.replace(/\W*\s(\S)*$/, '...'); 
 
\t \t  }); 
 
\t \t } 
 
    } 
 
    
 
});

.textSec{border:solid 1px red;display:inline-block;vertical-align:top;height:120px;overflow:hidden; padding:10px; width: 200px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="textSec"> 
 
     <p>LIC's New Children’s Money Back Plan is a participating non-linked money back plan. This plan is 
 
specially designed to meet the educational, marriage and other needs of growing children through 
 
Survival Benefits. In addition, it provides for the risk cover on the life of child during the policy term 
 
and for number of survival benefits on surviving to the end of the specified durations. </p> 
 
</div> 
 

 
<div class="textSec"> 
 
    <p>LIC's New Money Back Plan-20 years is a participating 
 
            non-linked plan which offers an attractive combination of 
 
            protection against death throughout the term of the plan along 
 
            with the periodic payment on survival at specified durations 
 
            during the term. This unique combination provides financial 
 
             support for the family of the deceased policyholder any 
 
             time before maturity and lump sum amount at the time of 
 
             maturity for the surviving policyholders. This plan also 
 
             takes care of liquidity needs through its loan facility. 
 
</p> 
 
           </div> 
 

 
<div class="textSec"> 
 
<p>LIC’s Anmol Jeevan - II is a protection plan which provides financial protection to the insured’s family in case of his/her unfortunate demise. 
 
<br > 
 
Benefits: 
 
Death Benefit: In case of unfortunate death of the Life Assured during the policy 
 
term Sum Assured shall be payable. 
 
<br >Maturity Benefit: On survival to the end of the policy term, nothing shall be payable.</p> 
 
    </div> 
 

 
<div class="textSec"> 
 
    <p>This is an immediate annuity plan, which can be purchased by paying a lump sum amount. 
 
            This plan provides for 
 
            annuity payments of a stated amount throughout the life time of the annuitant. 
 
Various options are available for the type and mode of payment of annuities. <br /> 
 
Premium in this plan is to be paid in a lump sum. Annuity may be paid either at 
 
monthly, quarterly, half yearly or yearly intervals. Annuitant may choose any mode of payment of annuity.</p> 
 
</div> 
 

 
<div class="textSec"> 
 
    <p>LIC's Jeevan Arogya is a unique non-participating 
 
            non-linked plan which provides health insurance cover 
 
            against certain specified health risks and provides you 
 
            with timely support in case of medical emergencies and helps 
 
            you and your family remain financially independent in difficult 
 
             times. Health has been a major concern on everybody’s mind, 
 
             including yours. In these days of skyrocketing medical expenses, 
 
             when a family member is ill, it is a traumatic time for the rest 
 
             of the family. As a caring person, you do not want to let any 
 
             unfortunate incident to affect your plans for you and your 
 
             family. So why let any medical emergencies shatter your peace 
 
             of mind. </p> 
 
     </div>

Answer 1

那麼你應該單獨設置每個段落的高度，而不是通過第一個元素。

var p = $('.textSec p'); //grabs all of the paragraphs 
var divh=$('.textSec').height(); //we read the height of the first texxtSec element 
p.each(function() { //loop over the paragraphs 
    var para = $(this); //current paragraph 
    while (para.outerHeight()>divh) { //loop until the height condition is met 
     para.text(function (index, text) { 
      return text.replace(/\W*\s(\S)*$/, '...'); 
     }); 
    } 
}); 

Answer 2

var p = $('.textsec').find('p')或var p = $('.textsec').children('p')根據您的嵌套元素。