0

だから私はリンクのonclick（）イベントで呼び出されるJsにこの関数を持っています。

HTMLは次のとおりです。

<li class="collapsed"> 
<span> 
<a href="#!" onclick="expand(this)">Directions</a> 
</span> 
<p>ajajgajajys agajgjgtajgtdja ajdtajtjate ajgdjagjd ajt</p> 
</li>

そして、ここにJavascriptがあります：

function expand(myElem)
{           
    if (myElem.parentNode.parentNode.style.height<100)
        myElem.parentNode.parentNode.style.height="100px";
    else
        myElem.parentNode.parentNode.style.height="45px";
}

明らかに、コードはリンクが含まれている li 親タグを展開します。元々、li タグはheight:45px;CSS のように設定されています。それから彼らはに変わり100pxます。私が抱えている問題は、JavaScriptが2回しか機能しないことです。リンクをクリックして、li を展開できます。次に、それらをクリックして、li を折りたたむことができます。その後、再び働きたくありません。ブラウザのエラーを調べていたところ、次のことがわかりました。

「'高さ' の値を解析中にエラーが発生しました。宣言が削除されました。

インターウェブを何度もトローリングした後、jsにユニット宣言を含めていないためだと思いました。でも私はそうよ！

myElem.parentNode.parentNode.style.height="45px"; ---- as you can see.

****注: 私の解決策* ****

このスレッドに出くわした人のための将来の参考のために、ここに私の解決策があります：

HTML --> 私は最終的に次のようなことをしました:

<span class="heading">
     Link1
<span>

<span class="information">
     Info about Link1
</span>

<span class="heading">
     Link2
<span>

<span class="information">
     Info about Link2
</span>

Jquery は非常にシンプルでした。

$(document).ready(function() {

     $(".information").hide();


     $(".heading").click(function(){
          var item = $(this);

          item.next().slideToggle(500);          
     });
});

...非常にシンプルで、魅力的に機能します

4

3 に答える 3

1

replaceなどのparseInt機能を使ってみて、

function expand(myElem)
{           
    if (parseInt(myElem.parentNode.parentNode.style.height.replace('px','')) < 100)
        myElem.parentNode.parentNode.style.height="100px";
    else
        myElem.parentNode.parentNode.style.height="45px";
}

次のように単純化するためにJqueryを使用できます。

HTML

<li class="collapsed"> 
  <span> 
   <a href="#!" class="direction">Directions</a> 
  </span> 
  <p>ajajgajajys agajgjgtajgtdja ajdtajtjate ajgdjagjd ajt</p> 
</li>

脚本

$(function(){
    $('.direction').on('click',function(e){
       var ht= $('.collapsed').height()==100 ? 45 : 100;
       $('.collapsed').height(ht);
    });
});
于 2013-07-31T04:20:28.323 に答える
0

皆様、ご協力ありがとうございました。なんらかの理由で、高さが2回目に45pxに設定された後、intとして登録されなくなったことがわかりました。そうですね。最初に 100px の宣言を受け入れて int として登録するのに、2 回目に登録しないのはなぜですか? 奇妙な。

とにかく、私は parseInt を試してみましたが、それは魅力的でした。しかし、私は Jason P が提供した jQuery ソリューションが本当に気に入っています。移行は私を売りました。私はそれで行きます。もう一度ありがとう。

于 2013-07-31T17:26:08.197 に答える
0

試す

if (parseInt(myElem.parentNode.parentNode.style.height)<100)
于 2013-07-31T04:10:11.010 に答える