2

ここで助けが必要です。

動的コンテンツを div に表示したい。私はすでに以下のコードを持っています:

<script type="text/javascript"><!--
  function ReplaceContentInContainer(id,content) {
  var container = document.getElementById(id);
  container.innerHTML = content;
}
//--></script>

<div id="example1div" style="padding:10px; text-align:left;">
    <p>Content 1</p>
</div>

<p align="center"><a href="javascript:ReplaceContentInContainer('example1div','<p>Content 2</p>')">View another</a></p>

「別のビュー」をクリックすると、「コンテンツ1」が「コンテンツ2」に置き換えられますが、ここで必要なのは、「コンテンツ2」がすでに表示されているときに「別のビュー」をクリックしたいということです再度リンクし、div コンテンツを「コンテンツ 3」のような新しいコンテンツに再度置き換えます。

誰でも私がこれを解決するのを手伝ってください。

前もって感謝します ：）

4

1 に答える 1

1

OPのコメント後に更新

HTML

jQuery ライブラリ ファイルを含める

<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>

プラグインを使用https://github.com/fkling/jQuery-Function-Toggle-Plugin --> 任意の数の関数を受け入れ、任意のイベントに使用できます。

デモ

あなたはこのようなものが欲しいです。

<script type="text/javascript">
/*
 * jQuery Function Toggle Pluing
 * Copyright 2011, Felix Kling
 * Dual licensed under the MIT or GPL Version 2 licenses.
 */

(function ($) {
    $.fn.funcToggle = function (type, data) {
        var dname = "jqp_eventtoggle_" + type + (new Date()).getTime(),
            funcs = Array.prototype.slice.call(arguments, 2),
            numFuncs = funcs.length,
            empty = function () {},
            false_handler = function () {
                return false;
            };

        if (typeof type === "object") {
            for (var key in type) {
                $.fn.funcToggle.apply(this, [key].concat(type[key]));
            }
            return this;
        }
        if ($.isFunction(data) || data === false) {
            funcs = [data].concat(funcs);
            numFuncs += 1;
            data = undefined;
        }

        funcs = $.map(funcs, function (func) {
            if (func === false) {
                return false_handler;
            }
            if (!$.isFunction(func)) {
                return empty;
            }
            return func;
        });

        this.data(dname, 0);
        this.bind(type, data, function (event) {
            var data = $(this).data(),
                index = data[dname];
            funcs[index].call(this, event);
            data[dname] = (index + 1) % numFuncs;
        });
        return this;
    };
}(jQuery));

$('#chnage_p').funcToggle('click', function () {
    $('#example1div').text('Content 1');
}, function () {
    $('#example1div').text('Content 2');
}, function () {
    $('#example1div').text('Content 3');
}, function () {
    $('#example1div').text('Content 4');
});
</script>
于 2013-09-14T02:26:37.170 に答える