最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

ios - javascriptselect2: keyboard shows when select is clicked - Stack Overflow

programmeradmin1浏览0评论

I'm using select2 and I'm using it more or less like this:

<select id="e1">

    <option value="AL">Alabama</option>

    <option value="WY">Wyoming</option>

    ....

</select>

and the code

$('#e1').select2({ minimumResultsForSearch: -1 }) ;

With that option set to -1 it doesn't show the search box, but on the iPad/iPhone it does show the keyboard. Is there any way I can prevent the keyboard from showing ?

I'm using select2 and I'm using it more or less like this:

<select id="e1">

    <option value="AL">Alabama</option>

    <option value="WY">Wyoming</option>

    ....

</select>

and the code

$('#e1').select2({ minimumResultsForSearch: -1 }) ;

With that option set to -1 it doesn't show the search box, but on the iPad/iPhone it does show the keyboard. Is there any way I can prevent the keyboard from showing ?

Share Improve this question asked Sep 27, 2013 at 20:26 JohnnyJohnny 411 silver badge3 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 3

Using jQuery, add this to a container of your select2

$(".someSelect2Container input").prop("readonly",true);

I solved this problem for iOS:

 $(document).ready(function() { $("select").select2(
            .on("select2-selecting", function(e) {
                setTimeout(function() {
                    document.activeElement.blur();
                }, 500);
            }); 
         });

For people searching in the future if you're looking to keep the search functionality but STOP the keyboard from automatically popping up and taking up the screen space on mobile... the following worked for me (may be a faster/easier way to do it but I did it quickly to test and it worked and I was so excited I had to post it here):

    window.select2typing = false;
    $(document).on("focus",".select2-search__field",function(){
        if(window.select2typing == false){
            $(this).blur();
        }
    });

    $(document).on("click",".select2-search__field",function(){
        window.select2typing = true;
        $(this).focus();
    });

    $("select").on("select2:close",function(){
        window.select2typing = false;
    });

This will stop the keyboard from popping up, stop it from auto-focusing the select2 search field and once they tap/click on the search field it'll give them the option to start typing.

发布评论

评论列表(0)

  1. 暂无评论