0

かなり複雑な単一ページ アプリケーションを実装しており、「Jquery-context-menu」ツールボックスを使用することにしました。ただし、基本的な質問があります。2 日間検索し、Web で情報を読んだ後、アイデアがいくらか出てきました。

基本的な質問は次のとおりです。もしそうなら、メニューがまだオンになっている間に、メニューの外から更新機能 (つまり、無効化機能) にアクセスする方法は?

シナリオ: ゲームを実装しています。ユーザーがアクティブ化できるアイコンのコンテキスト メニューとして「jquery コンテキスト メニュー」を使用します (rpg タイプのアイコンを考えてください)。クリックしてアクティブ化すると、(数秒後に) 自動的に非アクティブ化され、しばらくすると再びアクティブ化できるようになります。メニューが開いたままの状態で、メニューを有効または無効にすることで、メニューがアイコンのこの状態をキャプチャしているということです。

ここにあるように、同じメニューでボタンを押すことによって、メニュー項目の可視性を変更する方法の 1 つの例があります。

http://medialize.github.io/jQuery-contextMenu/demo/disabled-ching.html

ただし、外部サイトから (ノックアウト サブスクライブ コールを介して) メニューを更新することを目指しています。したがって、次のようなことをしたいと思います。

myknockoutobservable.subscribe(function(newValue){
correctRefernceToThis.data('disableItem1', newvalue)});

無効な機能は次のようになります。

disabled: function(key, opt) {
return !this.data('cutDisabled')};

または、これが機能しない場合は、更新関数を直接呼び出すことができます

 myKnockoutobservable.subscribe(function(newValue){
$.contextMenu.op.update(correctRefernceToOpt,correctRefernceToroot)});

次に、コールバックで観測可能なノックアウトを照会します

if (!myKnockoutobservable) {
return true;}
else {
return false;

主な問題は、コンテキストを正しく参照していないことにあるようです。そのため、Jquery コンテキスト メニューの外部から、適切な this、opt、to root、変数のハンドルを持っていません (少なくともそれが現在の意見）。誰かが解決策を見つけるのを手伝ってくれたり、何を試してみるべきか (まだ試していないこと) を教えてくれたりすると、とてもうれしいです。

4

2 に答える 2

0

サブスクライブしません。ビューモデルに true または false に設定したオブザーバブルがあり、それに応じてメニュー項目が切り替わります。メニュー項目の無効なメンバーは次のようになります。

disabled: function() { 
    return myobservable();
}

James Thorpe がコメントしたように、カスタム バインディング ハンドラーを作成して、コンテキスト メニューをセットアップする必要があります。

なじみのないいくつかのツールを使用しているようです。最小限の例を含む Fiddle を次に示します: http://jsfiddle.net/sv3m7ok8/

更新bodyコンテキスト メニューは単一の要素にバインドするのではなく、セレクターを使用するため、タグ でバインドする方が理にかなっていることがわかりました。更新された例: http://jsfiddle.net/sv3m7ok8/1/

再度更新しました が、メニューが開いているときにメニュー項目を有効/無効にしようとしていることがわかりました（通常はそうではありません）。メニュー項目ノードにたどり着くには、内部に潜り込み、サブスクリプションを接続して、無効化されたクラスを設定する必要がありました。

init: function (element, data, allbindings, data) {
    var dynamicDisable = false;
    $.contextMenu({
        selector: '.context-menu-one',
        callback: function (key, options) {
            var m = "clicked: " + key;
            window.console && console.log(m) || alert(m);
        },
        items: {
            "edit": {
                name: "Clickable",
                icon: "edit",
                disabled: function (opt, key) {
                    if (!dynamicDisable) {
                        var node = key.items.edit.$node[0];
                        data.disableMenu.subscribe(function (dis) {
                            $(node)[dis ? 'addClass' : 'removeClass']('disabled')
                        });
                        dynamicDisable = true;
                    }
                    return data.disableMenu();
                }
            }
        }
    });
}

私のフィドルは、disableMenuを切り替える間隔を設定します。メニュー項目がアクティブになり、灰色になるのを見ることができます。

http://jsfiddle.net/sv3m7ok8/3/

于 2015-06-09T12:36:40.730 に答える