1

内部にヘッダーを含む div ボックスから始めました。

私の希望はtoggle()、ヘッダーがクリックされたときにヘッダー文字列を変数に格納し、そのヘッダーの HTML を変更し、parent()それを含む div ボックスをアニメーション化するイベントを持つことです。

2 番目の関数は、parent()div ボックスを再びアニメーション化し、HTML を元のテキスト (変数として格納される) に戻すことです。

私は問題を抱えていますが、どこに問題があるのか​​ わかりません。元のヘッダーの文字列を「取得」するために使用html()していますが、それが正しいかどうかはわかりません。また、変数を渡すため、または変数を正しく呼び出すために、さらに予防策が必要かどうかもわかりません。

http://jsfiddle.net/94nPv/1/

私が間違っていることを教えてください。どうもありがとう。

4

1 に答える 1

3

メソッドを使用して.data()、元の html http://jsfiddle.net/94nPv/3/を保存できます。

jQuery(document).ready(function($) {
    $('h5').toggle(function() {
        var $this = $(this);
        $this.data('originalText',$this.html());
        $this.parent('div.softwarebox').animate({ height: "700px" });
        $this.html("Close");
    }, function() {
        var $this = $(this);
        $this.parent('div.softwarebox').animate({ height: "19px" });
        $this.html($this.data('originalText'));
    });        
});​

わずかに最適化されています (.html または .data への余分な呼び出しはありません): http://jsfiddle.net/94nPv/7/

jQuery(document).ready(function($) {
    $('h5').each(function(){
        var $this = $(this);
        $this.data('originalText',$this.html());
    });
    $('h5').click(function() {
        var $this = $(this);
        if ($this.text() === "Close") {
            $this.html($this.data('originalText'));
            $this.parent('div.softwarebox').animate({
                height: "19px"
            });
        }
        else {
            $this.text("Close");
            $this.parent('div.softwarebox').animate({
                height: "700px"
            });
        }
    });
});​
于 2012-06-14T19:44:21.787 に答える