4

最後に呼び出された関数の実行を取り消す機会はありますか。たとえば、

<nav><a href="foo">...</a></nav>

次のような onclick-listener があります。

$(function() {
    $('nav a').on('click', function() {
        $('nav a').removeClass('active');
        $(this).addClass('active');
        $($(this).attr('href')).addClass('active');
        return false;
    });
});

最後の関数の実行を取り消すことができるものを探しています。なにか提案を？どうも！！！:)

4

5 に答える 5

13

コマンド パターンを使用します。

コマンド オブジェクトは、複数レベルのアンドゥを実装するのに役立ちます。プログラム内のすべてのユーザー アクションがコマンド オブジェクトとして実装されている場合、プログラムは最近実行されたコマンドのスタックを保持できます。ユーザーがコマンドを元に戻したい場合、プログラムは単純に最新のコマンド オブジェクトをポップし、その undo() メソッドを実行します。

基本的な JavaScript の実装は次のようになります。

function command(instance) {    
  this.command = instance;
  this.done = [];

  this.execute = function execute() {
    this.command.execute();
    this.done.push(this.command);
  };      
  this.undo = function undo() {
    var command = this.done.pop();
    command.undo();    
  };  
}

これをテストするには、単純な DOM を構築します。

<ul>
    <li>first</li>
</ul>

使用するコマンド オブジェクトを定義します。このようなオブジェクトには、実行ロジックと、DOM の以前の状態を再構築するための追加の動作が含まれている必要があります (少なくともこのサンプル ケースでは)。

var appendcommand = new command({
  execute: function(){
    $('ul').append('<li>new</li>');
  },
  undo: function(){
      $('ul li:last').remove();
  }
});

実行後:

appendcommand.execute();

あなたのページはから変わります

  • 最初

に

  • 最初
  • 新着

次の実行中:

appendcommand.undo();

このページを元の状態に変換します。

  • 最初
于 2012-11-09T13:27:42.773 に答える
0 
$('nav a').unbind()

http://api.jquery.com/unbind/

- また -

$('nav a').off()

http://api.jquery.com/off/

于 2014-01-31T20:28:38.260 に答える
0

JavaScript エンジンは以前の状態を保存しません。自分で行う必要があります。これは、操作するオブジェクトの以前と現在の状態を追跡する必要があることを意味します。

あなたの場合、「以前にアクティブだった」オブジェクトのリストを持つことができ、「元に戻す」はそのリストに基づいて前の要素をアクティブにします。

私はコードを試していませんが、これからアイデアを得る必要があります。また、配列に問題がある場合は、 http://www.w3schools.com/jsref/jsref_obj_array.aspを確認してください。

var undoList = new Array();

function manipulate(elem) {
    $('nav a').removeClass('active');
    $(elem).addClass('active');
    //...
}

function undo() {
    if(undoList.length > 0) {
        var elemToManipulate = undoList.pop();
        manipulate(elemToManipulate);
    }        
}

function manipulateWithUndo(elem) {
    undoList.push(elem);
    manipulate(elem);
}
于 2012-11-09T10:28:48.217 に答える