文档章节

dart系列(五) 可筛选的“下拉列表框”

 小小程序员1644
发布于 2015/12/02 23:19
字数 176
阅读 20
收藏 0
点赞 0
评论 0

图:


index.html

<!DOCTYPE html>
 

<html>
<head>
    <meta charset="utf-8">
    
    <title>combox筛选框</title>
    <link rel="stylesheet" href="styles.css">
    <script async src="main.dart" type="application/dart"></script>
  <!--  <script async src="packages/browser/dart.js"></script> -->

</head>

<style  type="text/css">
 .ulcss li{
  list-style-type:none;
 }
 
 
</style>

  <input type="text" id="inpt" /> <div id="ddd"></div>
  <ul id="ultest" class="ulcss"   >
    <li>中文</li>
    <li>文</li>
    <li>2015-01-01</li>
    <li>2225-01-01</li>
    <li>~!@#%^&*()</li>
    <li>!ABCDE</li> 
    <li>!abcde</li> 
  </ul>

</body>
</html>


main.dart

import 'dart:html';

void main() {
   var myInput = querySelector('#inpt');   
   
   
   void checkInput( Event e)
   {
     var ultest = querySelector('#ultest');

     var inputStr = ( myInput as InputElement).value.toLowerCase();
     
     for( var i=0; i< ultest.children.length; i++)
     {
        var ulStr  = ultest.children[i].text.toLowerCase();
        
        if( ulStr.contains( inputStr ) )            //检查每个li是不是包含输入框输入的value
        {
          ultest.children[i].style.cssText = "";
          ultest.children[i].style.cssText = "display: visible; ";
        }else{
          ultest.children[i].style.cssText = "";
          ultest.children[i].style.cssText = "display: none;";
        }
     }
   }
   myInput.onInput.listen(checkInput);
}



© 著作权归作者所有

共有 人打赏支持
粉丝 3
博文 17
码字总数 2287
作品 0
广州
如何批量删除Excel空行

我们在利用Excel统计与分析对象时,数据的录入工作不可能一蹴而就,记录的添加、删除、剪切、合并是少不了的,在经过多次的编辑修改过程之后,在表格中往往会出现许多的空行。这些空行的存在...

晨曦之光 ⋅ 2012/03/09 ⋅ 0

学习Rost-CM内容挖掘系统的分词工具

GooSeeker开发团队成发的在线的分词工具软件,要做到“文科生能用的分词软件”,比如,公共管理专业、社会学各专业、工商行政管理各专业、营销管理各专业等等。“文科生”没有任何褒贬含义,...

华天清 ⋅ 05/25 ⋅ 0

Windows Server 2008 IP策略关闭135端口

现在简要介绍一下关闭Windows Server2008一些端口的步骤: 1.点击 控制面板-管理工具",双击打开"本地策略",选中"IP安全策略,在本地计算机“右边的空白位置右击鼠标,弹出快捷菜单,选择"...

lgl梁 ⋅ 2014/12/09 ⋅ 0

Excel动态图表方法大集合,总有一款适合你!

图文 | 朱莉 来源 | 精进Excel 在这个万物都要看颜值的年代,做个数据报表也要好看。如果这时候能做个会动的图表,相信一定会加分不少。 动态图表制作的方法很多,根据不同情况,可以使用数据...

安伟星 ⋅ 2017/12/10 ⋅ 0

在Entity Framework中使用存储过程(三):逻辑删除的实现与自增长列值返回

本篇文章通过实例的方式,讨论两个在EF使用存储过程的主题:如何通过实体和存储过程的映射实现逻辑删除;对于具有自增长类型主键的数据表,在进行添加操作的时候如何将正确的值反映在实体对象...

长平狐 ⋅ 2012/09/04 ⋅ 0

编写更加通用的 JavaScript

当你准备好抽象出一个 Web 组件的时候, JavaScript 能帮你做到,融入组件的 JavaScript 变得优雅利索;此时它像一把瑞士军刀,轻松帮你应对各种场景。但当你急于交付时,JavaScript 也能帮你...

红薯 ⋅ 2011/02/10 ⋅ 8

Windows Phone 7 自动完成输入框控件AutoCompleteBox

自动完成输入框控件AutoCompleteBox是一种很常用的控件,它实现了文本框的输入的自动搜索的功能,可以加快用户的输入效率。该控件在微软的Silverlight 开源控件项目“Silverlight Toolkit”中...

junwong ⋅ 2012/02/28 ⋅ 0

Excel动态图表应用

之前的动态图表是依靠数据的变化来使图表变化。本实例依然应用上一次的动态图表数据,但要让图表自动变化。这里的重点是要采用“名称管理器”,用自定义名称配合窗口控件来展现动态图表。本例...

技术小牛人 ⋅ 2017/11/04 ⋅ 0

Excel高级筛选操作图解

每次在给学生讲Excel高级筛选时,总是有一种无力感,最少一半人要给讲两遍才能明白什么是高级筛选、高级怎么做。索性在此将高级筛选写成博文一篇,权当再做一次总结。这里以Excel2010的操作为...

百年求索 ⋅ 2017/08/09 ⋅ 0

关于下拉列表的问题,望高手解答。

如果有这样一个下拉列表。选否时只获取value就可以了。 但是选择“是”的话在下拉列表下面弹出一个上传文件的文本框(比如:用代码表示就是 )用jquery方法怎么让他选择“是”时候弹出一个上...

功夫panda ⋅ 2012/02/08 ⋅ 3

没有更多内容

加载失败,请刷新页面

加载更多

下一页

OSChina 周三乱弹 —— 这样的女人私生活太混乱了

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @ 胖达panda :你经历过体验到人生的大起大落吗?我一朋友在10秒内体验了,哈哈。@小小编辑 请点一首《almost lover》送给他。 《almost love...

小小编辑 ⋅ 47分钟前 ⋅ 7

自己动手写一个单链表

文章有不当之处,欢迎指正,如果喜欢微信阅读,你也可以关注我的微信公众号:好好学java,获取优质学习资源。 一、概述 单向链表(单链表)是链表的一种,其特点是链表的链接方向是单向的,对...

公众号_好好学java ⋅ 52分钟前 ⋅ 0

Centos7重置Mysql 8.0.1 root 密码

问题产生背景: 安装完 最新版的 mysql8.0.1后忘记了密码,向重置root密码;找了网上好多资料都不尽相同,根据自己的问题总结如下: 第一步:修改配置文件免密码登录mysql vim /etc/my.cnf 1...

豆花饭烧土豆 ⋅ 今天 ⋅ 0

熊掌号收录比例对于网站原创数据排名的影响[图]

从去年下半年开始,我在写博客了,因为我觉得业余写写博客也还是很不错的,但是从2017年下半年开始,百度已经推出了原创保护功能和熊掌号平台,为此,我也提交了不少以前的老数据,而这些历史...

原创小博客 ⋅ 今天 ⋅ 0

LVM讲解、磁盘故障小案例

LVM LVM就是动态卷管理,可以将多个硬盘和硬盘分区做成一个逻辑卷,并把这个逻辑卷作为一个整体来统一管理,动态对分区进行扩缩空间大小,安全快捷方便管理。 1.新建分区,更改类型为8e 即L...

蛋黄Yolks ⋅ 今天 ⋅ 0

Hadoop Yarn调度器的选择和使用

一、引言 Yarn在Hadoop的生态系统中担任了资源管理和任务调度的角色。在讨论其构造器之前先简单了解一下Yarn的架构。 上图是Yarn的基本架构,其中ResourceManager是整个架构的核心组件,它负...

p柯西 ⋅ 今天 ⋅ 0

uWSGI + Django @ Ubuntu

创建 Django App Project 创建后, 可以看到路径下有一个wsgi.py的问题 uWSGI运行 直接命令行运行 利用如下命令, 可直接访问 uwsgi --http :8080 --wsgi-file dj/wsgi.py 配置文件 & 运行 [u...

袁祾 ⋅ 今天 ⋅ 0

JVM堆的理解

在JVM中,我们经常提到的就是堆了,堆确实很重要,其实,除了堆之外,还有几个重要的模块,看下图: 大 多数情况下,我们并不需要关心JVM的底层,但是如果了解它的话,对于我们系统调优是非常...

不羁之后 ⋅ 昨天 ⋅ 0

推荐:并发情况下:Java HashMap 形成死循环的原因

在淘宝内网里看到同事发了贴说了一个CPU被100%的线上故障,并且这个事发生了很多次,原因是在Java语言在并发情况下使用HashMap造成Race Condition,从而导致死循环。这个事情我4、5年前也经历...

码代码的小司机 ⋅ 昨天 ⋅ 2

聊聊spring cloud gateway的RetryGatewayFilter

序 本文主要研究一下spring cloud gateway的RetryGatewayFilter GatewayAutoConfiguration spring-cloud-gateway-core-2.0.0.RC2-sources.jar!/org/springframework/cloud/gateway/config/G......

go4it ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部