使い方

$("foo").MTAppFieldSplit({
    debug: false,
    splitCount: 2,
    placeholders: [],
    styles: [],
    classes: [],
    addClass: '',
    separator: ','
});

foo には MTAppFieldSplit を適用させたい input:text のセレクタを設定します。
オプション設定は下記の通りです。

オプション

debug（Type : Boolean, Default : false）

debug: true をセットすると、実際のフィールドに値が入ったのを確認することが出来ます。

$('#customfield_mtappfieldsplit').MTAppFieldSplit({
  debug: true
});

splitCount（Type : Number, Default : 2）

分割するフィールドの数を設定します。初期値は2です。

$('#customfield_mtappfieldsplit').MTAppFieldSplit({
  splitCount: 3
});

placeholders（Type : Array, Default : []）

placeholders オプションに配列を設定し、分割後の input 要素の placeholder 属性を設定することが出来ます。
配列に設定した値が先頭から順に分割後の input 要素に設定されます。

$('#customfield_mtappfieldsplit').MTAppFieldSplit({
  splitCount: 3,
  placeholders: ['定価', '送料', 'サイズ']
});

と設定すると以下の様になります。

classes（Type : Array, Default : []）

classes オプションに配列を設定し、分割後の input 要素の class 属性を設定することが出来ます。
配列に設定した値が先頭から順に分割後の input 要素に設定されます。

$('#customfield_mtappfieldsplit').MTAppFieldSplit({
  splitCount: 3,
  placeholders: ['定価', '送料', 'サイズ'],
  classes: ['text min', 'text min', 'text min']
});

と設定すると以下の様になります。

styles（Type : Array, Default : []）

styles オプションに配列を設定し、分割後の input 要素の style 属性を設定することが出来ます。
配列に設定した値が先頭から順に分割後の input 要素に設定されます。

$('#customfield_mtappfieldsplit').MTAppFieldSplit({
  splitCount: 3,
  placeholders: ['定価', '送料', 'サイズ'],
  classes: ['text min', 'text min', 'text min'],
  styles: [
    'margin-right: 5px; border-color: red;',
    'margin-right: 5px; border-color: blue;',
    'border-color: green;'
  ]
});

と設定すると以下の様になります。

separator（Type : String, Default : ',')

separator オプションでは値の区切り文字を指定することが出来ます。

初期値は','です。

サンプル

例えば、キーワード欄を「タイプ」「コード」「名前」という３分割にしてスタイルを調整したい場合は、user.js に次のコードを書きます。

$('#title').MTAppFieldSplit({
  splitCount: 3,
  placeholders: ['タイプ', 'コード', '名前'],
  classes: ['text title', 'text title', 'text title'],
  styles: [
    'width: 19%; margin-right: 1%;',
    'width: 19%; margin-right: 1%;',
    'width: 60%;'
  ]
});