markTimespan

Description

通过应用默认或自定义样式来高亮或阻止特定日期。高亮会在应用内部任何更新后立即移除。此功能适用于强调某些日期。

markTimespan: (config: any) => any[]

Parameters

• config - (required) object - 要标记或阻止的时间段的配置详情

Returns

• divs - (array) - 返回一个 HTML 元素数组

Example

//高亮特定日期
scheduler.markTimespan({  
    days:  5,               // 高亮每周五  
    zones: "fullday",       // 高亮全天
    css:   "gray_section"   // 应用的 CSS 类
});

//高亮并阻止特定日期
scheduler.markTimespan({  
    days:  5,
    zones: "fullday",
    css:   "gray_section",
    type:  "dhx_time_block" // 固定值，用于阻止该时间段
});

Related samples

• Handling the pointer highlighting

Details

注释

该方法自版本 3.5 起可用。

注释

该方法需要启用 limit 插件。

配置对象属性

配置对象支持以下属性:

属性	说明
start_date	一个 Date 对象，指定限制开始时间
	// 阻止从 2012年5月3日 开始直到 'end_date' 的事件创建 start_date:new Date(2012,4,3)
end_date	一个 Date 对象，指定限制结束时间
	// 阻止从 'start_date' 开始直到 2012年9月3日 的事件创建 end_date:new Date(2012,8,3)
days	要限制的日期
	days:[0, 2, 6] // 限制星期日、星期二和星期六 days:"fullweek" // 限制整周 days:new Date(2012,6,1) // 阻止 2012年7月1日
zones	要限制的时间段，单位为分钟
	zones:[4*60,8*60,12*60,15*60] // 两个限制区间：04:00-08:00，12:00-15:00 zones:"fullday" // 限制全天
css	要应用的 CSS 类名
	css:"gray" // 创建一个带有 'gray' CSS 类的 DIV
html	在标记范围内显示的 HTML 内容
	html:"<b>Blocked</b>" // 在标记范围的 DIV 内添加此文本
type	指定时间段的类型。设置为 'dhx_time_block' 时会阻止该时间段。其他值仅标记时间段，不阻止
	type: "dhx_time_block" // 标记并阻止该时间段
invert_zones	是否反转由 'zones' 设置的时间段（默认 false）
	// 结果为两个限制区间：00:00-08:00，17:00-24:00 zones: [8*60, 17*60], invert_zones: true // 结果为两个限制区间：00:00-08:00，17:00-24:00 zones: [0, 8*60, 17*60, 24*60], invert_zones: false
sections	限制阻止仅针对特定视图中的特定项。阻止仅在相关视图内生效
	// 仅阻止 Units 视图中 id=5 的项的日期 // 以及 Timeline 视图中 id 为 2 和 3 的项 sections: { unit: 5, timeline: [2,3]}

配置属性的可接受组合

注释

请注意，days、zones 与 start_date、end_date 是成对定义阻止区间的，不应混用。 例如，不能将 zones 与 start_date 一起使用，也不能同时将 days 与 start_date 和 end_date 组合。

有效的属性组合有两种:

属性组合	示例
days zones invert_zones css html type sections	var config ={ days: 1, zones: [9*60, 15*60], css: "cssClassName", sections: { unit: 5 } }
start_date end_date css html type sections	var config ={ start_date: new Date(2012,7,13), end_date: new Date(2012,7,14), css: "cssClassName", sections: { unit: 5 } }

markTimespan() 与 addMarkedTimespan() 的对比

addMarkedTimespan	markTimespan
需要调用 updateView 方法来渲染时间段的 DIV	自动渲染时间段的 DIV
时间段会永久显示	应用内部任何更新后，时间段会立即隐藏
返回创建的时间段 ID	返回一个 DIV 或 DIV 数组

Related Guides

• Blocking and Marking Dates