编程 Javascript

AngularJS基础 ng-open 指令简单实例

Posted in Javascript onAugust 02, 2016

AngularJS ng-open 指令

AngularJS 实例

通过点击 checkbox 显示或隐藏 <details> 列表:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

点击这里显示 details 列表: <input type="checkbox" ng-model="showDetails"><br>
<br>

<details ng-open="showDetails">
 <summary>学的不仅是技术，更是梦想！</summary>
 <p> - 菜鸟教程</p>
</details>

<p><b>注意：</b> 目前只有 Opera, Chrome, 和 Safari 浏览器支持 details 标签。</p>

</body>
</html>

定义和用法

ng-open 指令用于设置 details 列表的 open 属性。

如果 ng-open 的表达式返回 true 则 details 列表是可见的。

语法

<details> 元素支持该指令。

参数值

值	描述
expression	如果表达式为 true 则会设置 details 的 open 属性。

以上就是对AngularJS ng-open 指令的资料整理，后续继续补充。

AngularJS基础 ng-open 指令简单实例

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

javascript对JSON数据排序的3个例子

Apr 12 Javascript

jQuery获取动态生成的元素示例

Jun 15 Javascript

详解JavaScript 中的 replace 方法

Jan 01 Javascript

javascript求日期差的方法

Mar 02 Javascript

javascript数组去重小结

Mar 07 Javascript

javascript 正则表达式去空行方法

Jan 24 Javascript

详解vue父子组件间传值(props)

Jun 29 Javascript

基于JavaScript 性能优化技巧心得(分享)

Dec 11 Javascript

p5.js入门教程之图片加载

Mar 20 Javascript

在vue.js中使用JSZip实现在前端解压文件的方法

Sep 05 Javascript

JS实现倒序输出的几种常用方法示例

Apr 13 Javascript

vue - vue.config.js中devServer配置方式

Oct 30 Javascript

AngularJS基础 ng-non-bindable 指令详细介绍

Aug 02 #Javascript

实例详解jQuery的无new构建

Aug 02 #Javascript

AngularJS基础 ng-mouseover 指令简单示例

Aug 02 #Javascript

JavaScript比较当前时间是否在指定时间段内的方法

Aug 02 #Javascript

图文详解JavaScript的原型对象及原型链

Aug 02 #Javascript

AngularJS基础 ng-mousemove 指令简单示例

Aug 02 #Javascript

功能强大的Bootstrap使用手册（一）

Aug 02 #Javascript

You might like

PHP基本语法总结

2014/09/06 PHP

PHP使用星号替代用户名手机和邮箱的实现代码

2018/02/07 PHP

身份证号码前六位所代表的省,市,区, 以及地区编码下载

2007/04/12 Javascript

js left,right,mid函数

2008/06/10 Javascript

JAVASCRIPT keycode总结

2009/02/04 Javascript

Mootools 1.2教程定时器和哈希简介

2009/09/15 Javascript

JS实现程序暂停与继续功能代码解读

2013/10/10 Javascript

常见表单重复提交问题整理及解决方法

2013/11/13 Javascript

jQuery操作元素css样式的三种方法

2014/06/04 Javascript

jQuery操作DOM之获取表单控件的值

2015/01/23 Javascript

贴近用户体验的Jquery日期、时间选择插件

2015/08/19 Javascript

JQuery实现左右滚动菜单特效

2015/09/28 Javascript

使用JSON作为函数的参数的优缺点

2016/10/27 Javascript

jQuery实现表格元素动态创建功能

2017/01/09 Javascript

在vue中读取本地Json文件的方法

2018/09/06 Javascript

从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法

2018/09/18 Javascript

vue实现移动端悬浮窗效果

2018/12/01 Javascript

vue-cli中安装方法(图文详细步骤)

2018/12/12 Javascript

微信小程序 checkbox使用实例解析

2019/09/09 Javascript

使用layui的layer组件做弹出层的例子

2019/09/27 Javascript

Jquery让form表单异步提交代码实现

2019/11/14 jQuery

Python中logging模块的用法实例

2014/09/29 Python

一个基于flask的web应用诞生使用模板引擎和表单插件（2）

2017/04/11 Python

python使用itchat库实现微信机器人(好友聊天、群聊天)

2018/01/04 Python

基于Django静态资源部署404的解决方法

2019/07/28 Python

详解PyTorch手写数字识别(MNIST数据集)

2019/08/16 Python

python实现飞机大战游戏（pygame版）

2020/10/26 Python

Python requests获取网页常用方法解析

2020/02/20 Python

Python 内存管理机制全面分析

2021/01/16 Python

JAVA程序设计笔试题面试题一套

2015/07/28 面试题

毕业生个人求职的自我评价

2013/10/28 职场文书

反邪教警示教育方案

2014/05/13 职场文书

夫妻忠诚协议范文

2014/11/16 职场文书

检讨书大全

2015/01/27 职场文书

2019年销售部季度工作计划3篇

2019/10/09 职场文书

Linux下使用C语言代码搭建一个简单的HTTP服务器

2022/04/13 Servers