diff --git a/components/datepicker/demo/range.md b/components/datepicker/demo/range.md
index 2c9283107b..9164dcac58 100644
--- a/components/datepicker/demo/range.md
+++ b/components/datepicker/demo/range.md
@@ -1,24 +1,19 @@
 # 范围
 
 - order: 3
-- description: 设置可选日期的范围，用 disabled 方法来定义不可选择时间。
+- description: 设置可选日期的范围，用 disabled 方法来定义不可选择时间。比如不可选择今天之后的日期。
 
 ---
 
 ````jsx
 var Datepicker = antd.datepicker;
-
-var Picker = React.createClass({
-  handleChange: function(value) {
-    console.log(new Date(value.getTime()));
-  },
-  render: function() {
-    return <Datepicker onSelect={this.handleChange} />
-  }
-});
+var disabledDate = function(current, value) {
+  // can not select days after today
+  return current.getTime() > Date.now();
+};
 
 React.render(
-  <Picker />
+  <Datepicker disabled={disabledDate} />
 , document.getElementById('components-datepicker-demo-range'));
 ````
 
diff --git a/components/datepicker/index.jsx b/components/datepicker/index.jsx
index f7aad6209a..62b462a388 100644
--- a/components/datepicker/index.jsx
+++ b/components/datepicker/index.jsx
@@ -21,11 +21,14 @@ module.exports = React.createClass({
     };
   },
   componentDidMount: function () {
+    var state = {};
     if (this.props.value) {
       var value = new GregorianCalendar(zhCn);
       value.setTime(new Date(this.props.value));
-      this.setState({value: value});
+      state.value = value;
     }
+    state.disabled = this.props.disabled || function() {};
+    this.setState(state);
   },
   handleChange: function() {
     var props = this.props;
@@ -34,6 +37,7 @@ module.exports = React.createClass({
   render: function () {
     var calendar = (
       <Calendar
+      disabledDate={this.state.disabled}
       locale={CalendarLocale}
       orient={['top', 'left']}
       showClear={true} />