码迷,mamicode.com
首页 > 编程语言 > 详细

javascript——ctrl加回车留言

时间:2015-03-21 11:09:17      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:

HTML部分:

<input type="text" name="" id="text1">
    <ul id="ul1"></ul>
    <!-- 文本框中输入文字,按下ctrl+回车 -->

JS部分:

window.onload = function(){

            //获取相关元素
            var oText = document.getElementById(‘text1‘);
            var oUl = document.getElementById(‘ul1‘);


            oText.onkeyup = function(ev){
                //获取事件对象
                var ev = ev || event;

                //判断当前文本值不为空时
                if(this.value != ‘‘){

                    //判断键盘按回车和Ctrl键时
                    if(ev.keyCode == 13 && ev.ctrlKey){

                        //创建li,并把文本框当前的value值赋给li的innerHTML
                        var oLi = document.createElement(‘li‘);
                        oLi.innerHTML = this.value;

                        //判断是否存在ul下面第一个子节点是否存在
                        if(oUl.children[0]){

                            //ul下存在子节点就插入到前面
                            oUl.insertBefore(oLi , oUl.children[0]);
                        }else{
                            
                            //ul下不存在子节点,就添加到ul后面
                            oUl.appendChild(oLi);
                        }
                    }
                }
            }
        };

 

javascript——ctrl加回车留言

标签:

原文地址:http://www.cnblogs.com/bokebi520/p/4355198.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!