「ポップアップメニューでチェックボックス」の版間の差分

提供: MeryWiki
ナビゲーションに移動 検索に移動
手石 (トーク | 投稿記録)
MSY-07 (トーク | 投稿記録)
変数にvarの宣言を追加
 
(2人の利用者による、間の17版が非表示)
1行目: 1行目:
= 概要 =
== 概要 ==
ポップアップメニューを使ったチェックボックス(のようなもの)です。
ポップアップメニューを使ったチェックボックス(のようなもの)です。


= 機能 =
== 機能 ==
* 選択項目は、{ "項目名" : boolean }という形の連想配列で与えてください。<br />trueで与えると最初からチェックされます。
* 選択項目は、{ "項目名" : boolean }という形の連想配列で与えてください。trueで与えると最初からチェックされます。
* 返り値も、連想配列です。
* 返り値も、連想配列です。
* キャンセルしたときの返り値は、空の連想配列です。
* キャンセルしたときの返り値は、与えた連想配列です。


= 履歴 =
== 変更履歴 ==
* 20140125 初版
* 1.0.1 (2014-01-26)
* 20140126 初期値を与えられるようにした。関数バージョンを追加した。
** 初期値を与えられるようにした
** 関数バージョンを追加した
** キャンセルのとき、与えた連想配列を返すようにした
* 1.0.0 (2014-01-25)
** 初版


= コード =
== ソースコード ==
* オブジェクトバージョン
=== オブジェクトバージョン ===
<source lang="javascript">
<syntaxhighlight lang="javascript" copy>
// chkbox.js
// chkbox.js
// 2014/01/25/
// 2014-01-25


CheckBox = function(){
var CheckBox = function(){
   this.initialize.apply( this, arguments );
   this.initialize.apply( this, arguments );
}
}
24行目: 28行目:
   menuitem : "アイテム(連想配列)", // { key : boolean, …… }
   menuitem : "アイテム(連想配列)", // { key : boolean, …… }
   index : "メニューに表示された順序",
   index : "メニューに表示された順序",
  initial : "初期選択状態",
   initialize : function( arg1 ){
   initialize : function( arg1 ){
     this.menuitem = arg1;
     this.menuitem = arg1;
     this.index = [];
     this.index = [];
    this.initial = {};
    for ( var key in arg1 ){
      this.initial[ key ] = arg1[ key ];
    }
   },
   },
   show : function(){
   show : function(){
36行目: 45行目:
       switch ( r ){
       switch ( r ){
       case selcan - off:
       case selcan - off:
         return {};
         return this.initial;
       case selok - off:
       case selok - off:
         return this.menuitem;
         return this.menuitem;
71行目: 80行目:
   Alert( i + " -> " + r[ i ] );
   Alert( i + " -> " + r[ i ] );
};
};
</syntaxhighlight>


</source>
=== 関数バージョン ===
<br />
<syntaxhighlight lang="javascript" copy>
* 関数バージョン
<source lang="javascript">
// chkbox2.js
// chkbox2.js
// 2014/01/26/
// 2014-01-26


var r = CheckBox( { "a":true, "b":false, "c":false, "d":false } );
var r = CheckBox( { "a":true, "b":false, "c":false, "d":false } );
87行目: 95行目:
   var menuitem = arg1;
   var menuitem = arg1;
   var index = [];
   var index = [];
   var off = 5;
   var off = 5, selcan = 0, selok = 1;
   var r = 0, selcan = 0, selok = 1;
   var r = 0;
 
  var initial = {};
  for ( var key in arg1 ){
    initial[key] = arg1[key];
  }


   while( r >= 0 ){
   while( r >= 0 ){
94行目: 107行目:
     switch ( r ){
     switch ( r ){
     case selcan - off:
     case selcan - off:
       return {};
       for ( var key in menuitem ){
        menuitem[key] = initial[key];
      }
      return menuitem;
     case selok - off:
     case selok - off:
       return menuitem;
       return menuitem;
118行目: 134行目:


}
}
</source>
</syntaxhighlight>


= その他 =
== その他 ==
おかしい箇所やもっといい方法があったら教えてください。<br />
* 連想配列を変数で宣言しておけば、関数の実行で変数が書き換えられることに気が付きました。オブジェクトバージョンにメリットはなさそうです……。
<syntaxhighlight lang="javascript" copy>
var items = { "a":true, "b":false, "c":false, "d":false };
var r = CheckBox( items );
for ( var i in r ){
  Alert( i + " -> " + r[ i ] );
};
CheckBox( items );
for ( var i in items ){
  Alert( i + " -> " + items[ i ] );
};
</syntaxhighlight>

2025年11月25日 (火) 11:23時点における最新版

概要[編集]

ポップアップメニューを使ったチェックボックス(のようなもの)です。

機能[編集]

  • 選択項目は、{ "項目名" : boolean }という形の連想配列で与えてください。trueで与えると最初からチェックされます。
  • 返り値も、連想配列です。
  • キャンセルしたときの返り値は、与えた連想配列です。

変更履歴[編集]

  • 1.0.1 (2014-01-26)
    • 初期値を与えられるようにした
    • 関数バージョンを追加した
    • キャンセルのとき、与えた連想配列を返すようにした
  • 1.0.0 (2014-01-25)
    • 初版

ソースコード[編集]

オブジェクトバージョン[編集]

// chkbox.js
// 2014-01-25

var CheckBox = function(){
  this.initialize.apply( this, arguments );
}

CheckBox.prototype = {
  menuitem : "アイテム(連想配列)", // { key : boolean, …… }
  index : "メニューに表示された順序",
  initial : "初期選択状態",
  initialize : function( arg1 ){
    this.menuitem = arg1;
    this.index = [];
    this.initial = {};
    for ( var key in arg1 ){
      this.initial[ key ] = arg1[ key ];
    }
  },
  show : function(){
    var off = 5;
    var r = 0, selcan = 0, selok = 1;

    while( r >= 0 ){
      r = showPopupMenu( this );
      switch ( r ){
      case selcan - off:
        return this.initial;
      case selok - off:
        return this.menuitem;
      default :
        this.menuitem[ this.index[ r ] ] = !this.menuitem[ this.index[ r ] ];
      };
    }

    function showPopupMenu( obj ){
      var menu = CreatePopupMenu();
      var i = 0;
      obj.index = [];
      for ( var key in obj.menuitem ){
        menu.Add( key , i + off, ( obj.menuitem[ key ] )? meMenuChecked : 0 );
        obj.index.push( key );
        i++;
      }
      menu.Add( "---", 0, meMenuSeparator );
      menu.Add( "キャンセル", selcan, 0 );
      menu.Add( "選択終了", selok, 0 );
      return menu.track( 0 ) - off;
    }
  }
}

var chkbox1 = new CheckBox( { "a":true, "b":false, "c":false, "d":false } );
var r = chkbox1.show();
for ( var i in r ){
  Alert( i + " -> " + r[ i ] );
};

var r = chkbox1.show();
for ( var i in r ){
  Alert( i + " -> " + r[ i ] );
};

関数バージョン[編集]

// chkbox2.js
// 2014-01-26

var r = CheckBox( { "a":true, "b":false, "c":false, "d":false } );
for ( var i in r ){
  Alert( i + " -> " + r[ i ] );
};

function CheckBox( arg1 ){
  var menuitem = arg1;
  var index = [];
  var off = 5, selcan = 0, selok = 1;
  var r = 0;

  var initial = {};
  for ( var key in arg1 ){
    initial[key] = arg1[key];
  }

  while( r >= 0 ){
    r = showPopupMenu();
    switch ( r ){
    case selcan - off:
      for ( var key in menuitem ){
        menuitem[key] = initial[key];
      }
      return menuitem;
    case selok - off:
      return menuitem;
    default :
      menuitem[ index[ r ] ] = !menuitem[ index[ r ] ];
    }
  }

  function showPopupMenu(){
    var menu = CreatePopupMenu();
    var i = 0;
    index = [];
    for ( var key in menuitem ){
      menu.Add( key , i + off, ( menuitem[ key ] )? meMenuChecked : 0 );
      index.push( key );
      i++;
    }
    menu.Add( "---", 0, meMenuSeparator );
    menu.Add( "キャンセル", selcan, 0 );
    menu.Add( "選択終了", selok, 0 );
    return menu.track( 0 ) - off;
  }

}

その他[編集]

  • 連想配列を変数で宣言しておけば、関数の実行で変数が書き換えられることに気が付きました。オブジェクトバージョンにメリットはなさそうです……。
var items = { "a":true, "b":false, "c":false, "d":false };
var r = CheckBox( items );
for ( var i in r ){
  Alert( i + " -> " + r[ i ] );
};
CheckBox( items );
for ( var i in items ){
  Alert( i + " -> " + items[ i ] );
};
スポンサーリンク