美文网首页MUI学习指南
[MUI插件]MUI搜索框及其事件调用

[MUI插件]MUI搜索框及其事件调用

作者: 后端技术学习分享 | 来源:发表于2018-10-03 18:59 被阅读289次
    MUI是什么

    官网:MUI
    简单的说,MUI是一种前端框架,用这个框架可以开发手机APP的界面,此外还可以调用一些手机APP的原生功能。

    MUI搜索框

    只粘贴body部分的html代码

    <body>
        
        <div class="mui-content">
            
            <!-- MUI 搜索框 -->
            <div class="mui-input-row mui-search" id="searchForm">
                <input type="search" id="searchInput" onkeyup="enterSearch(event)" class="mui-input-clear" placeholder="搜索密码">
            </div>
            
        </div>
        
        <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/njs-io.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            mui.init({
              gestureConfig:{
               longtap: true //默认为false
              }
            });
            
            // 搜索事件,获取搜索关键词
            function enterSearch(event){
                if(event.keyCode == 13) {//用户点击回车的事件号为13
                    var keyword = document.getElementById('searchInput').value;
                    alert(keyword);
                }
            }
            
        </script>
    </body>
    

    相关文章

      网友评论

        本文标题:[MUI插件]MUI搜索框及其事件调用

        本文链接:https://www.haomeiwen.com/subject/hjqtaftx.html