angular或者js如何确定选中ul中的哪几个li

最新推荐文章于 2022-01-29 10:13:52 发布
最新推荐文章于 2022-01-29 10:13:52 发布
阅读量284 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/wuhjbk/p/7368234.html
版权

刚来新公司接到新的需求做一个知识库页面

红色的是单选    蓝色的是多选     这些都是需要传递到后台的 开始不知道如何解决  下班后在家想到一个很巧妙的办法  不多说上代码

 

箭头所指就是在li里写一个隐藏的radio标签，把后台需要的id字段绑定到这个隐藏的radio上选中的时候传这个选中的radio的value就行

转载于:https://www.cnblogs.com/wuhjbk/p/7368234.html

weixin_30709061
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
angularjs 的select设置默认值
lihaiming_2008的专栏
11-02 386
myAppModule.controller('FrmController',['$scope',function($scope){ $scope.colors =[{name:'black', shade:'dark'},{name:'white', shade:'light'},{name:'red', shade:'dark'},{name:'blue', shad...
angular下拉框点击无反应_用angularjs 模拟的ul li下拉框怎么实现点击空白处消失？...
weixin_39851307的博客
12-22 137
我使用的trick是，利用冒泡达到点击菜单外部关闭菜单的目的：var demo = angular.module('demo', []);demo.directive('menu', function(){return {restrict: 'E',scope: {},link: function(scope, element, attrs) {scope.displayMenu = false;...
angular js点击tab中的li标签加载相应div区域
weixin_34026484的博客
05-25 145
为什么80%的码农都做不了架构师？>>> ...
Angular基础知识
illiii的博客
01-29 728
Angular Angular初探 1. ngfor 应用范围 获取索引 获取第一项和最后一项 获取偶数项和奇数项 2. 事件的处理和样式绑定 <ul> <li *ngFor="let menu of menus; let i = index; let f = first; let even =even;"> <a href="#" [class.active]="selectIndex == i" [class.firs
Angular6学习笔记6: 在页面中显示列表（*ngFor/*ngIf）
W先生
08-15 8591
页面中显示列表（*ngFor/*ngIf指令的使用） 继学习笔记5以后，可以将一个Object对象显示在模版文件中(html) 真正在项目中，数据是来自后端服务器返回的，此时先创建一些模拟的数据。 1.创建模拟的数据 在src/app/文件夹中创建一个名叫mock-heroes.ts的文件。 wjydeMacBook-Pro:app wjy$ ng generate class...
angular或者js怎么确定选中ul中的哪几个li
10-19
下面小编就为大家带来一篇angular或者js怎么确定选中ul中的哪几个li。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
js tab栏切换代码实例解析
10-16
我们将探讨以下几个关键知识点： 1. **HTML布局**： HTML部分为Tab栏提供了基本的结构。`<div class="tab">` 是包含整个Tab组件的大盒子，它包含两个子盒子：标题栏`<div class="tab_list">`和内容栏`...
最好用的tab切换js特效
04-22
在这个主题中，我们将深入探讨如何利用JavaScript实现最好用的Tab切换特效。 首先，我们需要理解Tab切换的基本原理。通常，Tab切换由两部分组成：HTML结构和JavaScript逻辑。HTML定义了各个选项卡和内容区域，而...
分享一个不错的选项卡tabpane支持firefox
03-17
在给定的资源中，我们可以看到以下几个文件： 1. `tab.css`：这是一个CSS（层叠样式表）文件，用于定义选项卡组件的外观和布局。CSS是网页设计的重要组成部分，用于控制页面的样式和布局，如颜色、字体、间距等。在...
几种tab切换详解
08-31
Tab标题通过`<ul>`和`<li>`元素来创建，每个`<li>`对应一个Tab选项，而内容则通过多个`.demo`类的`<div>`来承载。 CSS部分主要负责样式设置，包括Tab的布局、颜色、边框等。例如，`.select` 类用于选中的Tab标题，...
angular中实现li或者某个元素点击变色的两种方法
12-29
本文介绍了angular中实现li或者某个元素点击变色的两种方法，分享给大家，希望对大家有帮助 先说一种最直接了当的不需要js控制。 方法一：直接在用ng-class就可以控制： <p ng-click=state ng-class={active:state>浮伤年华</p> <p ng-click=state ng-class={active:state>忧伤说笑</p> 在style里面设置如下： <style type=text/css> .active{ color:red; } </style> 这样就会点
Angular对标签的增删改查
MissGentlemen的博客
12-10 343
第二周练习 姓名查询条件 按年龄正序 按年龄倒序 用户列表 姓名 年龄 拼音 职位 操作 {{li.gname}} {{li.gage}} {{li.gpin}} {{li.gzhi}} 添加用户信息 姓名 年龄 拼音 职业 v
angular的checkbox选中状态判断及获取相应值
weixin_34220179的博客
11-21 1659
在input中绑定ng-click事件，addGroupLinkMan($event),传入event事件，控制器中监听event事件，可以利用该event获取想获取的数据；addcheckArr.splice(checked.id,1);方法中的checked.id是每一个input的索引值。 $scope.addGroupLinkMan = fun...
Angular基本使用
tangxueqin的博客
01-05 2542
1.数组 $scope.stus=[]; 2.往数组内添加数据 $scope.stus.push() 3.遍历数组 ng-repeat="st in stus" 4.删除数组 $scope.stus.splice(i,1);、、i为方法内传过来的$index 5.遍历的同时    orderBy: 排序+    filter查询 查询的输入框：
【Angular】radio选项如何确定是否选中，唯一性选中
陶洲川的博客
09-06 8724
在单选题的4个选项中，要保证1个为true，其它3个选项为false；这里用的radio属性；<input type='radio'>radio是收音机的意思，老式收音机，按下一个按钮后，其它的按钮都会弹上来，所以很形象的用radio来作为type的值；表示唯一性，排他性选中；但是在我的页面，只要我鼠标点击过的选项，都会被设置成true；就是说，虽然，浏览器页面看到的是，一个选中，其它三个没选中，但
Angularjs Ng_repeat中实现复选框选中并显示不同的样式
weixin_34250434的博客
08-02 215
最近做了一个选择标签的功能，把一些标签展示给用户，用户选择自己喜欢的标签，就类似我们在购物网站看到的那种过滤标签似的； 简单的效果如图所示： 首先看一下html代码： 1 <!DOCTYPE html> 2 <html data-ng-app="App"> 3 <head> 4 <script type="tex...
经典的js问题 实现点击li能够弹出当前li索引与innerHTML的函数
Kylin的专栏
06-23 7819
经典的js问题  实现点击li能够弹出当前li索引与innerHTML的函数 点击其中一项需要alert出如下结果： 按照我们平常的想法，代码应该是这样写的： var myul = document.getElementsByTagName("ul")[0]; var list = myul.getElementsByTagName("li"); functio
如何选中ul里的某一个li,并改变其样式
qq_45785424的博客
07-05 2118
1.html <ul id="ul"> <li v-for="(item,index) in list" :key="index" @click="changeLi(item,index)" > <div :class="select===index?'select':''"> <img src="~@/assets/logo.png" alt=""
angular从json串里获取数据赋值ul和table
c_hjf的博客
10-13 1396
html> html> head> meta charset="UTF-8"> script type="text/javascript" src="angular-1.3.0.js">script> title>title> script type="text/javascript"> var app = angular.module("myApp
Angular 2 中文教程：快速入门与开发指南
这个快速启动流程通常包括安装必要的工具，如Node.js，设置项目结构，引入Angular模块，创建第一个组件，并在浏览器中运行它。 开发指南是针对有一定基础的开发者，它涵盖了Angular的各个核心特性，如组件系统、...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值