JQuery несколько, переменная высота div, показать и скрыть

Question

Я не могу этого понять.Все остальные примеры или вопросы используют разные функции или не имеют переменной высоты.Кроме того, они все одного класса, так что моя другая проблема - добавление идентификаторов в этот беспорядок ... При этом я очень застрял.Я приму любой совет, который смогу получить.Спасибо за помощь.

  $(function(){
    var slideHeight = 36; // px
    var defHeight = $('.jswrap').height();
    if(defHeight >= slideHeight){
        $('.jswrap').css('height' , slideHeight + 'px');
        $('.jsreadmore').append('<a href="#">Read More</a>');
        $('.jsreadmore a').click(function(){
            var curHeight = $('.jswrap').height();
            if(curHeight == slideHeight){
                $('.jswrap').animate({
                  height: defHeight
                }, "normal");
                $('.jsreadmore a').html('Close');
            }else{
                $('.jswrap').animate({
                  height: slideHeight
                }, "normal");
                $('.jsreadmore a').html('Read More');
            }
            return false;
        });
    }
    });

Разметка:

<div class="jscontainer">
  <h4>title</h4>
      <div class="jswrap">
        <p>Content</p>
      </div>
</div>

<div class="jscontainer">
  <h4>title2</h4>
      <div class="jswrap">
        <p>Content</p>
      </div>
</div>        

здесь проблема

Answer 1

Это то, что вы пытаетесь сделать: http://jsfiddle.net/5VdBk/?

Нужно ли работать с несколькими слайдами?

Редактировать после того, как заметил, отредактируйте вопрос, упомянув несколько слайдов:

Обновленная версия, которая должна обрабатывать несколько слайдов с различным размером контента http://jsfiddle.net/5VdBk/1/

Answer 2

В вашем коде есть проблема: defHeight равен 20, поэтому первое значение if всегда ложно и ничего не происходит, потому что defHeight> = slideHeight всегда ложно.

Когда вы получаете это право, вы не должны делать это:

  $('.jsreadmore a').click(function(){

но это

  $('.jsreadmore a').live('click', (function(){

потому что 'a' добавляется после создания dom и для привязки событий к вновь созданным элементам вам нужно использовать live

Посмотрите на эту основную скрипку http://jsfiddle.net/FmzBP/1/