jQuery展開/ Collaspe DIV不能正常工作

我正在嘗試展開/摺疊DIV。我正在使用一個函數來傳遞我想要設置的高度，但它不擴展或摺疊DIV。有沒有人對我做錯了什麼有所瞭解？ JSFiddle jQuery展開/ Collaspe DIV不能正常工作

<html> 
<head> 
<style> 
.podTitles{ 
    float:left; 
    clear:none; 
    font-size:12px; 
    font-weight:bold; 
    color:#3A3938; 
    line-height:23px; 
    margin-left:10px; 
} 
</style> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script type='text/javascript'> 
function changeheight(heightval) { 
      var heightset = heightval + 'px'; 
      if(this.text == 'more') 
      { 
       $('#overviewtext').animate({ 'height': heightset }, 600); 
       $(this).text($(this).text() == 'more' ? 'less' : 'more'); 
      } 
      else if(this.text == 'less') 
      { 
       $('#overviewtext').animate({ 'height': '150px' }, 600); 
       $(this).text($(this).text() == 'more' ? 'less' : 'more'); 
      } 

     }; 
</script> 
</head> 
<body> 
<div style="background-image:url('Images/RedPodHeader.jpg'); background-repeat:no-repeat; width: 360px; height:23px; background-color: red;"> 
<span class="podTitles">Overview</span> 
<span style="float: right; padding-right: 10px;"><a href="javascript:;" onclick="changeheight(250);"id="morelink">more</a></span> 
</div> 
<div style="height: 150px; width: 338px; padding: 10px; border-bottom: 1px solid silver; border-left: 1px solid silver; border-right: 1px solid silver;" id="overviewtext"> </div> 
</body> 
</html>

來源

2012-01-30 ios85

我找不到jQuery的任何夾雜物在你的代碼....你沒有加載jQuery！ – poscaman 2012-01-30 18:48:39

@poscaman在我複製時忘了添加該行。但在jsfiddle它確實加載jquery，它仍然無法正常工作。 – ios85 2012-01-30 18:58:51

夫婦在腳本的變化，DEMO這裏

function changeheight(heightval, _this) { 
    var heightset = heightval + 'px'; 
    var thisText = $(_this).text() ; 
    if (thisText == 'more') { 
     $('#overviewtext').animate({ 
      'height': heightset 
     }, 600); 
     $(_this).text((thisText == 'more') ? 'less' : 'more'); 
    } 
    else if (thisText == 'less') { 

     $('#overviewtext').animate({ 
      'height': '150px' 
     }, 600); 

     $(_this).text((thisText == 'more') ? 'less' : 'more'); 
    } 

    return false; 
};

標記變化 - 加入這個作爲參數傳遞給FXN通話，

onclick="return changeheight(250, this);"

來源

2012-01-30 19:14:35

您需要通過this作爲參數傳遞給changeheight功能才能使用它。所以它會像changeheight(250, this)。那麼你的函數聲明將是function changeheight(heightval, that) . . .，其中that然後將引用調用該函數的鏈接。你還有其他問題，（我認爲.text應該是.innerHTML），但這應該讓你走上正軌。

來源

2012-01-30 19:03:07

jQuery展開/ Collaspe DIV不能正常工作

回答

相關問題