点击按钮修改

最新推荐文章于 2023-02-21 16:05:25 发布
最新推荐文章于 2023-02-21 16:05:25 发布
阅读量734 收藏 1
点赞数
分类专栏： 移动开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/NIJIADALINGE/article/details/79062706
版权 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="js/angular.min.js"></script>
        <script src="js/jquery-1.11.1.js"></script>
        <script>
            var app=angular.module("modu",[]);
            app.controller("con",function($scope){
                $scope.stus=[
                    {  
                        ck:false,  
                        id: 1,  
                        name: '赵云1',  
                        pwd: 123456,  
                        level: 1,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 2,  
                        name: '赵云2',  
                        pwd: 123456,  
                        level: 1,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 3,  
                        name: '赵云3',  
                        pwd: 123456,  
                        level: 1,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 4,  
                        name: '赵云4',  
                        pwd: 123456,  
                        level: 2,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 5,  
                        name: '赵云5',  
                        pwd: 123456,  
                        level: 2,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 6,  
                        name: '赵云6',  
                        pwd: 123456,  
                        level: 2,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 7,  
                        name: '赵云7',  
                        pwd: 123456,  
                        level: 3,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 8,  
                        name: '赵云8',  
                        pwd: 123456,  
                        level: 3,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 9,  
                        name: '赵云9',  
                        pwd: 123456,  
                        level: 3,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 10,  
                        name: '赵云10',  
                        pwd: 123456,  
                        level: 4,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 11,  
                        name: '赵云11',  
                        pwd: 123456,  
                        level: 4,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 12,  
                        name: '赵云12',  
                        pwd: 123456,  
                        level: 4,
                        time:'2017-10-01 10:10:15'
                    },
                    {  
                        ck:false,  
                        id: 13,  
                        name: '赵云13',  
                        pwd: 123456,  
                        level: 4,
                        time:'2017-10-01 10:10:15'
                    }
                ];
                
                $scope.add=function(){
                    var stu={
                        ck:false,  
                        id: 20,  
                        name: '赵云20',  
                        pwd: 123456,  
                        level: 1,
                        time:'2017-10-01 10:10:15'
                    };
                    $scope.stus.push(stu);
                }
                
                $scope.xuan=function(){
                    for (var i in $scope.stus) {
                        $scope.stus[i].ck=$scope.cks;
                    }
                }
                
                $scope.delall=function(){
                    var count=0;
                    for (var i=0;i<$scope.stus.length;i++) {
                        if ($scope.stus[i].ck) {
                            count++;
                            $scope.stus.splice(i,1);
                            i--;
                        }
                    }
                    
                    if (count==0) {
                        alert("请至少选择一条！");
                    }
                }
            })
        </script>
    </head>
    
    <body ng-app="modu" ng-controller="con">
        <input placeholder="用户名搜索" ng-model="sname" />
        <select ng-model="ji">
            <option value="">选择级别</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
        </select>
        　　　　　　　
        <select ng-model="pai">
            <option value="">排序</option>
            <option value="-name">按用户名倒序</option>
            <option value="-level">按级别倒序</option>
            <option value="-id">按ID倒序</option>
        </select><br />
        
        <button ng-click="add()">新增用户</button>　<button ng-click="delall()">批量删除</button>
        
        <table border="1" cellspacing="0" width="700">
            <tr>
                <td><input type="checkbox" ng-model="cks" ng-click="xuan()" /> </td>
                <td>ID</td>
                <td>用户名</td>
                <td>密码</td>
                <td>级别</td>
                <td>创建时间</td>
                <td>操作</td>
            </tr>
            
            <tr ng-repeat="a in stus | filter:{name:sname} | filter:{level:ji} | orderBy:pai">
                <td><input type="checkbox" ng-model="a.ck" /></td>
                <td>{{a.id}}</td>
                <td>{{a.name}}</td>
                <td>
                    {{a.pwd}}
                    <span ng-show="f">
                        <input ng-model="a.pwd" />
                        <button ng-click="f=false">保存</button>
                    </span>
                </td>
                <td>{{a.level}}</td>
                <td>{{a.time}}</td>
                <td><button ng-click="f=true">修改密码</button></td>
            </tr>
        </table>
        
    </body>
</html>


nijiadalinge
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
点击修改功能
03-18
NULL 博文链接：https://zhao103804.iteye.com/blog/638267
案例 -- 点击修改按钮样式
weixin_54902466的博客
07-11 320
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&..
点击修改
weixin_30888707的博客
01-05 182
<tr id="{$v.uid}">{switch name="$v.is_on" } {case value="已启用" }<a href="javascript:void(0);" class="cli">已启用</a>{/case} {case value="已停用"}<a href="javascript...
修改Button按钮
a1220694903的专栏
05-31 624
效果图： Button_selectorActivity.java package com.hlx.demo; import android.app.Activity; import android.os.Bundle; public class Button_selectorActivity extends Activity { @Override public vo
Xposed点击按钮修改手机imei的Demo
07-23
5. **按钮控制**：在控制端应用中，添加一个按钮，点击时触发ContentProvider更新IMEI值，并通知被修改IMEI的应用刷新数据。 6. **进程间通信**：使用BroadcastReceiver或者Intent服务等方式，确保ContentProvider...
vue组件中点击按钮后修改输入框的状态实例代码
12-28
要求点击修改按钮之后部分输入框由禁用状态变为可用状态.我使用了vue中的事件处理器,但是不知道怎么获取disabled这个属性的值,所以以失败告终.后来又使用了vue中的v-bind,使其与class或者style绑定,但是也没有作用 ...
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】
08-28
"微信小程序实现点击按钮修改view标签背景颜色功能示例" 微信小程序作为移动端应用的重要组成部分，需要实现各种交互功能以提高用户体验。其中，点击按钮修改view标签背景颜色功能是常见的交互操作。本文将详细介绍...
微信小程序实现点击按钮后修改颜色
10-15
在微信小程序中，实现点击按钮后修改颜色是一个常见的交互效果，可以增强用户的操作体验。本文将详细介绍如何在微信小程序中实现这一功能，并提供相应的代码示例。 首先，我们需要理解微信小程序的基本架构。微信小...
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】
08-28
微信小程序实现点击按钮修改字体颜色功能 微信小程序实现点击按钮修改字体颜色功能是微信小程序开发中的一项重要功能，本文将详细介绍微信小程序如何实现点击按钮修改字体颜色功能，涉及微信小程序wx:for循环读取...
js点击修改按钮后修改
weixin_34080903的博客
03-02 570
<buttonid="click">改变内容</button> <divid="t">要改变的内容</div> <scripttype="text/javascript"> document.getElementById("click").onclick=function(){ vartext=document.g...
修改Button的样式！
iteye_2923的博客
10-13 450
[code="java"]# [/code] 将该文件保存在 res/drawable/下 并使用android:src标签引用。 Android会自动改变对应状态的背景图片 在标签列表的顺序是至关重要的，因为只有在android:state_pressed和android:state_focuesd 同时为fa...
点击修改，可以修改文本框，进行取消或保存
忆寒云
05-03 1195
1.在故事版中，设计为 2.为其中的文本框和导航栏的添加按钮进行定义，在底部添加一个保存按钮，先设置为隐藏，想在点击修改按钮时，可以编辑文本框的内容，保存按钮出现，添加按钮变为取消在.m的@interface 和@end中 @property (weak, nonatomic) IBOutlet UILabel *CoachName; @property (weak, nona
javaScript点击更改内容
m15712884682的博客
11-28 456
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body> <div id='frm'> <input type="button" name="input" value="按钮" /> <input type="bu...
vue实现点击修改文字
????鱼干～
02-21 3955
vue实现点击修改文字
表格内单选一条数据实现修改按钮功能
yqw13989575652的博客
07-07 504
表格内单选一条数据实现修改按钮功能
5、Button代码中修改按钮的状态
lianghui0811
07-11 2313
this.pause.normalSprite = this.btnSprite[0];//this.btnSprite在编辑器已经设置好的 this.pause.pressedSprite = this.btnSprite[1]; this.pause.hoverSprite = this.btnSprite[1]; //设置按钮不可点击 this.buttonRight.interac...
点击按钮更改按钮样式
最新发布
05-25
要更改按钮样式，您可以使用CSS来为按钮添加样式。以下是一个例子： ... ``` 点击我 ``` CSS代码： ...这个 CSS 样式将使按钮背景变成蓝色，文本颜色为...您可以根据需要修改样式，例如更改颜色、文本大小或添加阴影等。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值