他的小前端 (1)—— 移动端特殊效果-网页小键盘

移动端的CLICK会延迟,这个效果没看出来延迟,为什么?

页面:

<div id="container" style="width: 200px">
        <p id="write" ></p>
        <ul id="keyboard">
            <li>1</li>
            <li>2</li>
            <li class="delete">delete</li>
        </ul>
    </div>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jianpan.js"></script>

JS:

$(function(){
    var $write = $('#write');
    $('#keyboard li').click(function(){
        var $this = $(this),
            character = $this.html(); // If it's a lowercase letter, nothing happens to this variable
        
        
        // Delete
        if ($this.hasClass('delete')) {
            var html = $write.html();
            $write.html(html.substr(0, html.length - 1));
            return false;
        }
        
        // Special characters
        if ($this.hasClass('return')) character = "\n";
        
        
        // Add the character
        $write.html($write.html() + character);
    });
    
});

************************************************************

有效个屁,安卓机没有延迟,IOS机还是延迟了。click是无用的,还是用回tap吧,测试了都没有延迟

                                                          2016-02-19

posted @ 2016-02-16 17:18  小前端-nye  阅读(140)  评论(0编辑  收藏  举报