diff --git a/src/Dialog.jsx b/src/Dialog.jsx
index e9eda9a7..d0147266 100644
--- a/src/Dialog.jsx
+++ b/src/Dialog.jsx
@@ -3,6 +3,7 @@
 var React = require('react');
 var domAlign = require('dom-align');
 var RcUtil = require('rc-util');
+var KeyCode = RcUtil.KeyCode;
 var Dom = RcUtil.Dom;
 var assign = require('object-assign');
 var anim = require('css-animation');
@@ -95,6 +96,12 @@ var Dialog = React.createClass({
     this.unMonitorWindowResize();
   },
 
+  handleKeyDown(e) {
+    if (e.keyCode === KeyCode.ESC) {
+      this.props.onRequestClose();
+    }
+  },
+
   render() {
     var props = this.props;
     var visible = props.visible;
@@ -118,15 +125,23 @@ var Dialog = React.createClass({
     var style = assign({}, props.style, dest);
 
     var maskProps = {};
+    var dialogProps = {
+      className :[prefixClsFn(prefixCls, ''), props.className].join(' '),
+      tabIndex: '0',
+      role: 'dialog',
+      ref: 'dialog',
+      style: style
+    };
     if (closable) {
       maskProps.onClick = this.props.onRequestClose;
+      dialogProps.onKeyDown = this.handleKeyDown;
     }
     if (style.zIndex) {
       maskProps.style = {zIndex: style.zIndex};
     }
     var footer;
     if (props.footer) {
-      footer = <div className={prefixClsFn(prefixCls, 'footer')}>{props.footer}</div>;
+      footer = (<div className={prefixClsFn(prefixCls, 'footer')}>{props.footer}</div>);
     }
     var header;
     if (props.title || closable) {
@@ -141,7 +156,7 @@ var Dialog = React.createClass({
     }
     return (<div className={className.join(' ')}>
     {props.mask !== false ? <div {...maskProps} className={prefixClsFn(prefixCls, 'mask')} ref="mask"/> : null}
-      <div className={[prefixClsFn(prefixCls, ''), props.className].join(' ')} tabIndex="0" role="dialog" ref='dialog' style={style}>
+      <div {...dialogProps}>
         <div className={prefixClsFn(prefixCls, 'content')}>
           {header}
           <div className={prefixClsFn(prefixCls, 'body')}>{props.children}</div>