问题一:H5或MUI有木有固定位置的搜索框?就是时时显示在页面的最上方,在导航栏的下方,就好像两个导航栏似的效果,只是下方的导航栏是一个搜索框或按钮。或者有固定的方法也可以。
问题二:想实现点击按钮,弹出一个弹出框,类似于安卓原生的dialog,在dialog里想添加复选框,然后选择复选框后点击确定,在页面显示出复选框内选中的内容。有能实现的方法么?也就是在dialog里选的数据可以带出来。
以上问题有解决方案的可以说一说,指点一下就好,十分感谢!
问题一:H5或MUI有木有固定位置的搜索框?就是时时显示在页面的最上方,在导航栏的下方,就好像两个导航栏似的效果,只是下方的导航栏是一个搜索框或按钮。或者有固定的方法也可以。
问题二:想实现点击按钮,弹出一个弹出框,类似于安卓原生的dialog,在dialog里想添加复选框,然后选择复选框后点击确定,在页面显示出复选框内选中的内容。有能实现的方法么?也就是在dialog里选的数据可以带出来。
以上问题有解决方案的可以说一说,指点一下就好,十分感谢!
第一个问题:
<div class="mui-input-row mui-search">
<input id="qdkey" type="search" placeholder="搜索" >
</div>
通过document.getElementById("qdkey").addEventListener('input',function(){
搜索的具体代码
});
第二个问题有几种方法,但是最简单的方法是更新最新的hbuild。查看example里的indexed-list-select.html
缘多多 (作者)
感谢回答!第一个问题我主要是想让他的位置固定,你确定你这个是固定位置的么?可以时时显示在在页面的最上方,比如让页面向下滑动了,这个搜索框是否可以做到一直在你可见的屏幕最上方,想导航栏一样,可以随时点击搜索框。第二个问题我在MUI的JS文档里找到一个弹出菜单,正在修改研究,修改好后会把成品放过来。
缘多多 (作者)
问题二中我实现了一个弹出菜单
<a href="#popover" class="mui-btn mui-btn-primary mui-btn-block">打开弹出菜单</a>
<div id="popover" class="mui-popover">
<ul class="mui-table-view">
<li class="mui-table-view-cell"><a href="#">Item1</a></li>
<li class="mui-table-view-cell"><a href="#">Item2</a></li>
<li class="mui-table-view-cell"><a href="#">Item3</a></li>
<li class="mui-table-view-cell"><a href="#">Item4</a></li>
<li class="mui-table-view-cell"><a href="#">Item5</a></li>
</ul>
</div>
我怎么监听这弹出框我选取了哪些信息呢?或者说怎么对这个弹出菜单进行监听?我在这个菜单里加了一个按钮,怎么实现点击按钮让弹出菜单关闭呢?
mui('.mui-popover').popover('toggle');
这句是是什么作用,文档描述mui会自动控制弹出菜单的打开和关闭,那也就是说这并不是打开或关闭的单一方法,也不能获取选择结果。
缘多多 (作者)
问题二的弹出菜单的问题已解决,需要的可以私信我。就不在这贴代码了。
问题一的搜索框的位置还是不固定,我把例子倒进项目,想把搜索框换成按钮,研究了一下,没有成功,主要不知道MUI是怎么固定这个输入框的,原理尚不理解,就不好迁移。。。
缘多多 (作者)
刚刚给你私信打完,结果碰到键盘写的全没了,在这里再打一遍吧。
在弹出框中添加复选框和按钮,点击按钮关闭弹出框。@yicixing 代码如下:
<a href="#popover" class="mui-btn mui-btn-primary car-button-login " style="width:100%;font-size: 18px;">添加内容 </a>
<div id="popover" class="mui-popover">
<form class="mui-input-group">
<div class="mui-input-row mui-checkbox" >
<label>内容1</label>
<input name="neirong1" type="checkbox" checked="true">
</div>
<div class="mui-input-row mui-checkbox" >
<label>内容2</label>
<input name="neirong2" type="checkbox">
</div>
<div class="mui-input-row mui-checkbox" >
<label>内容3</label>
<input name="neirong3" type="checkbox">
</div>
<div class="mui-input-row mui-checkbox" >
<label>内容4</label>
<input name="neirong4" type="checkbox">
</div>
<ul>
<li class="mui-table-view-cell" >
<button type="button" onclick="close()" class="mui-btn mui-btn-primary " style="width: 100px;margin: auto;" >
关闭弹出框
</button>
</li>
</ul>
</form>
</div>
在js中天加close()方法,并在方法中添加:
mui('.mui-popover').popover('toggle');
这样写的话,有一个问题,同一个webview中,如果存在多个弹出框,会出现混乱,比如我通过上面的关闭方式关闭第一个弹出框,由于js中有多个上面的方法,第二个或者第三个弹出框就会被自动打开。如果页面中只有一个的话是没有问题的。
缘多多 (作者)
感谢回答!第一个问题我主要是想让他的位置固定,你确定你这个是固定位置的么?可以时时显示在在页面的最上方,比如让页面向下滑动了,这个搜索框是否可以做到一直在你可见的屏幕最上方,想导航栏一样,可以随时点击搜索框。第二个问题我在MUI的JS文档里找到一个弹出菜单,正在修改研究。
2015-07-07 12:46
缘多多 (作者)
我看了demo里的list,就是想要这种效果,正在努力研究,先来给你点个赞。
2015-07-07 14:24
缘多多 (作者)
请问MUI的开关的滑动触发能取消么?只要动画效果,但不要滑动触发,只靠点击。
2015-07-09 16:30