add: 键盘事件

2019-11-26 19:49:07 +08:00 · 2019-11-26 19:49:07 +08:00 · 97c21c682e
commit 97c21c682e
parent 94e562d95f
3 changed files with 86 additions and 20 deletions
--- a/04-JavaScript基础/29-事件委托.md
+++ b/04-JavaScript基础/29-事件委托.md
@ -79,3 +79,18 @@

 - [JavaScript 事件委托详解](https://zhuanlan.zhihu.com/p/26536815)

+
+
+
+
+## 我的公众号
+
+想学习<font color=#0000ff>**代码之外的技能**</font>？不妨关注我的微信公众号：**千古壹号**（id：`qianguyihao`）。
+
+扫一扫，你将发现另一个全新的世界，而这将是一场美丽的意外：
+
+![](http://img.smyhvae.com/20190101.png)
+
+
+
+
--- a/04-JavaScript基础/30-键盘事件.md
+++ b/04-JavaScript基础/30-键盘事件.md
@ -15,7 +15,6 @@

 `DOMMouseScroll`：在火狐中需要使用 DOMMouseScroll 来绑定滚动事件。注意该事件需要通过addEventListener()函数来绑定。

-
 ## 键盘事件

 ### 事件名
@ -56,7 +55,7 @@
 可以通过`event`事件对象的`keyCode`来获取按键的编码。


-此外，`event`事件对象还提供了以下几个属性：
+此外，`event`事件对象里面还提供了以下几个属性：

 - altKey

@ -65,11 +64,63 @@
 - shiftKey


-上面这三个属性，可以用来判断`alt`、`ctrl`、和`shift`是否被按下。如果按下则返回true，否则返回false。
-
-
-
-
+上面这三个属性，可以用来判断`alt`、`ctrl`、和`shift`是否被按下。如果按下则返回true，否则返回false。代码举例：
+
+```html
+    <body>
+        <script>
+            document.onkeydown = function(event) {
+                event = event || window.event;
+                console.log('qianguyihao：键盘按下了');
+
+                // 判断y和ctrl是否同时被按下
+                if (event.ctrlKey && event.keyCode === 89) {
+                    console.log('ctrl和y都被按下了');
+                }
+            };
+        </script>
+    </body>
+```
+
+
+**举例**：input 文本框中，禁止输入数字。代码实现：
+
+
+```html
+    <body>
+        <input type="text" />
+
+        <script>
+            //获取input
+            var input = document.getElementsByTagName('input')[0];
+
+            input.onkeydown = function(event) {
+                event = event || window.event;
+
+                //console.log('qianguyihao:' + event.keyCode);
+                //数字 48 - 57
+                //使文本框中不能输入数字
+                if (event.keyCode >= 48 && event.keyCode <= 57) {
+                    //在文本框中输入内容，属于onkeydown的默认行为
+                    return false; // 如果在onkeydown中取消了默认行为，则输入的内容，不会出现在文本框中
+                }
+            };
+        </script>
+    </body>
+
+```
+
+
+## 举例
+
+
+## 我的公众号
+
+想学习<font color=#0000ff>**代码之外的技能**</font>？不妨关注我的微信公众号：**千古壹号**（id：`qianguyihao`）。
+
+扫一扫，你将发现另一个全新的世界，而这将是一场美丽的意外：
+
+![](http://img.smyhvae.com/20190101.png)



--- a/05-JavaScript进阶/JavaScript开发积累.md
+++ b/05-JavaScript进阶/JavaScript开发积累.md
@ -1,14 +1,11 @@

-
 ### 方法的注释

-
 方法写完之后（注意，一定要先写完整），我们在方法的前面输入`/**`，然后回车，会发现，注释的格式会自动补齐。

 比如：


-
 ```javascript
 /**
 * 功能：给定元素查找他的第一个元素子节点，并返回
@ -21,7 +18,6 @@ function getFirstNode(ele){
 }
 ```

-
 ### 断点调试

 （1）先让程序运行一遍。
@ -51,7 +47,6 @@ function getFirstNode(ele){
 ![](http://img.smyhvae.com/20180124_2038.png)


-
 ### 2019-05-20-给数组、对象赋值

 **数组赋值的正确写法**：
@ -69,14 +64,19 @@ Object.assign(this.dataObj, dataObj);
 上方代码中，是将`dataObj` 的值追加到`this.dataObj`中。如果对象里属性名相同，会被覆盖。


-
-
-
-
-
-
-
-
+### 2019-11-25-在新的窗口中打开url
+
+在原来的窗体中跳转到新页面：
+
+```javascript
+window.location.href="要跳转的新页面";
+```
+
+在新窗体中打开新页面：
+
+```javascript
+window.open('你所要跳转的新页面');
+```