API Docs for: 0.2
Show:

window.Bizs.ChangeLogic Class

input[type=radio|type=checkbox], select change 事件的响应逻辑


应用场景

表单操作时, 选择某个 radio 时, 对应的 内容有效,
但选择其他 radio 时, 其他的内容无效
checkbox / select 也可使用( 带change事件的标签 )

require: JC.BaseMVC

JC Project Site | API docs | demo link

div 需要 添加 class="js_bizChangeLogic"

box 的 HTML 属性

bclTrigger
触发禁用/起用的control
bclDisableTarget
需要禁用/起用的control
bclHideTarget
需要根据禁用起用隐藏/可见的标签
bclDoneCallback = function
启用/禁用后会触发的回调, window 变量域
function bclDoneCallback( _triggerItem, _boxItem ){
   var _ins = this;
   JC.log( 'bclDoneCallback', new Date().getTime() );
}
bclEnableCallback = function
启用后的回调, window 变量域
function bclEnableCallback( _triggerItem, _boxItem ){
   var _ins = this;
   JC.log( 'bclEnableCallback', new Date().getTime() );
}
bclDisableCallback = function
禁用后的回调, window 变量域
function bclDisableCallback( _triggerItem, _boxItem ){
   var _ins = this;
   JC.log( 'bclDisableCallback', new Date().getTime() );
}
bclChangeCleanTarget = selector
radio change 的时候, 清除目标选择器的 html 内容
bclTriggerChangeOnInit = bool, default = true
初始化实例时, 是否触发 change 事件

trigger 的 HTML 属性

bclDisable = bool, default = false
指定 bclDisableTarget 是否置为无效
还可以根据这个属性 指定 bclHideTarget 是否显示
bclDisplay = bool
指定 bclHideTarget 是否显示
bclDelimiter = string, default = "||"
bclDisplay 和 bclDisable 多值分隔符
bclHideTargetSub = selector
根据 trigger 的 checked 状态 显示或者隐藏 bclHideTargetSub node
bclShowToggleFilter = selector | html attr
显示的时候, 如果匹配到 filter, 那么将会隐藏

hide target 的 HTML 属性

bclHideToggle = bool, default = false
显示或显示的时候, 是否与他项相反
bclDisableToggle= bool, default = false
disabled 的时候, 是否与他项相反

Constructor

window.Bizs.ChangeLogic

()

Example:

   <div class="js_bizChangeLogic"
       bclTrigger="/input[type=radio]"
       bclDisableTarget="/input.js_disableItem"
       >
       <label>
           <input type="radio" name="discount" checked  
           bclDisable="true"
           />自本协议签订之日起10日内生效
       </label> <br>
       <label>
           <input type="radio" name="discount" 
           bclDisable="false"
           />生效时间点
       </label>
       <input type="text" class="ipt js_disableItem" datatype="date" value=""
       /><input type="button" class="UXCCalendar_btn">
   </div>

Item Index

Methods

Methods

getInstance

(
  • _selector
)
ChangeLogic instance static

获取或设置 ChangeLogic 的实例

Parameters:

  • _selector Selector

Returns:

ChangeLogic instance:

init

(
  • _selector,
)
static

初始化 _selector | document 可识别的 ChangeLogic HTML属性

Parameters:

  • _selector, Selector

    default = document

on

(
  • _evtName
  • _cb
)

使用 jquery on 绑定事件

Parameters:

Returns:

ChangeLogicInstance

selector

()

获取 显示 ChangeLogic 的触发源选择器, 比如 a 标签

Returns:

selector

trigger

(
  • _evtName
)

使用 jquery trigger 绑定事件

Parameters:

Returns:

ChangeLogicInstance