ReoGrid ReoGrid Web
selection multi-range ctrl-click lite v1.6

複数範囲の選択

Ctrl+クリック(macOSはCmd)で、選択を置き換えずに範囲を追加します。セルでも行・列ヘッダーでも同じで、削除・書式設定・自動調整・コピーはすべての範囲にまとめて効きます。

デモの解説

このデモは地域別の売上シートを描画します — 気になる行が隣り合わずに散らばっている、あの種類の表です。v1.6.0から、Ctrl(macOSではCmd。macOSのCtrl+クリックは右クリックのため)を押しながらクリックすると、選択を置き換えずに範囲を追加します。セルでも行・列ヘッダーでも同じで、両エディションで利用できます。

  • Ctrl/Cmdを押しながらクリック・ドラッグで範囲を追加します。通常のクリックや矢印キーで単一範囲に戻り、Shift+クリックは最新の範囲を広げつつ他を保ちます
  • ステータス行はonSelectionChange(active, ranges)で更新しています。第2引数はv1.6の新機能なので、既存の1引数のリスナーは影響を受けません
  • 「Style every selected range」はws.selection.rangesを走査します。単一範囲の選択でも1要素が返るため、常に安全に使えます
  • Deleteはすべての選択範囲を1手のundoでまとめて消します。デモのClearボタンも同じことをAPIから行います
  • コピーはExcelの規則に従い、範囲が整列している(同じ列で縦に並ぶ、または同じ行で横に並ぶ)場合のみ1ブロックとして運ばれます。それ以外はExcelと同じ説明とともに拒否されます
  • 複数範囲を選択している間はフィルハンドルとドラッグ移動が無効になり、選択済みのセルをCtrl+クリックしても解除ではなく追加になります

主要 API

ws.selection.add('D4:E6')

Ctrl+クリックのAPI版 — 範囲を追加し、それがアクティブになります

ws.selection.ranges

選択中のすべての矩形をRangeHandleで返します(最後がアクティブ)。「選択範囲」への操作はこれが安全です

ws.selection.count

選択されている矩形の数(未選択なら0)

ws.selection.range

従来どおり単一範囲 — 最後に選択された<strong>アクティブ</strong>な範囲を指します

ws.onSelectionChange((active, ranges) => …)

第2引数がすべての範囲を列挙します。1引数のリスナーはそのまま動きます

ソースコード

TypeScript

関連ドキュメント

関連デモ

ニュースレター

開発の最新情報をお届けします

新しいリリース・機能追加・お知らせをいち早く受け取るには、
メーリングリストにご登録ください。