zoukankan      html  css  js  c++  java
  • JS 对输入判断变化屏蔽中文输入法连续输入时触发的事件

    //智能搜索提示
        IntelligenceSearch: function IntelligenceSearch() {
    
            $('#keyWord').on('input', function () {
                if ($(this).prop('comStart')) return;    // 中文输入过程中不截断
                var url = $('#hKeyWord').val();
                var data = { keyword: $('#keyWord').val() };
                $('#words').html('');
                imcis.ajax(url, data, false, function (data) {
                    var option = "";
                    $.each(data, function (key, value) {
                        option += '<option value=' + value + '>';
                    });
                    $('#words').html(option);
                    //alert('H');
                });
            }).on('compositionstart', function () {
                $(this).prop('comStart', true);
            }).on('compositionend', function () {
                $(this).prop('comStart', false);
            });
        }
    复制代码

    HTML以及加载方法:

    复制代码
    <input list="words" autocomplete="off" id="keyWord" style="font-size:12px;" type="text" placeholder="请输入关键字" />
                        <datalist id="words" style="background:red">
    
                            @*<option value="Internet Explorer">
                            <option value="Firefox">
                            <option value="Chrome">
                            <option value="Opera">
                            <option value="Safari">
                            <option value="Sogou">*@
                        </datalist>
    复制代码

    采用H5的datalist去提示

     $(function () {
                MedicalCase.IntelligenceSearch();
            });

    前台加载一下

    具体的原理如下:

    复制代码
          $(function () {
                    $('#text').on('input', function () {
                        if ($(this).prop('comStart')) return;    // 中文输入过程中不截断
    
                        var value = $(this).val();
                        console.log('当前输入:' + value);
                        //if (Str.byteLen(value, 3) > 24) {
                        //    $(this).val(Str.getMaxlen(value, 24));
                        //}
                    }).on('compositionstart', function () {
                        $(this).prop('comStart', true);
                        console.log('中文输入:开始');
                    }).on('compositionend', function () {
                        $(this).prop('comStart', false);
                        console.log('中文输入:结束');
                    });
                })
    复制代码

    开始和结束代表着事件的开始捕捉和结束捕捉

    ,这个做的更好一些能在后台加入缓存处理吗。还请大神指教

    积累小的知识,才能成就大的智慧
  • 相关阅读:
    POJ 1659 Frogs' Neighborhood
    zoj 2913 Bus Pass(BFS)
    ZOJ 1008 Gnome Tetravex(DFS)
    POJ 1562 Oil Deposits (DFS)
    zoj 2165 Red and Black (DFs)poj 1979
    hdu 3954 Level up
    sgu 249 Matrix
    hdu 4417 Super Mario
    SPOJ (BNUOJ) LCM Sum
    hdu 2665 Kth number 划分树
  • 原文地址:https://www.cnblogs.com/ylldbk/p/5555622.html
Copyright © 2011-2022 走看看