z2

来源:互联网 发布:windows dvd 播放器 编辑:程序博客网 时间:2024/05/07 12:05
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style>        *{            margin: 0;            padding: 0;        }        ul{            width: 400px;            height: 300px;            border: 1px solid black;        }        li{            padding: 5px;            list-style: none;        }        .box{            width: 500px;            height: 1000px;            display: block;            margin: 100px auto;        }        .box2{            height: 120px;            width: 200px;            display: block;            border: 1px solid black;        }        .buttons{            height: 40px;            line-height: 40px;            text-align: center;            margin-top: 30px;        }        .box3{            height: 120px;            width: 200px;            display: block;            border: 1px solid black;        }        .box4{            height: 120px;            width: 200px;            display: block;            border: 1px solid black;        }    </style>    <script src="angular-1.5.5/angular.min.js"></script>    <script>        var myapp=angular.module("myapp",[]);        myapp.controller("myCtrl",function ($scope) {            $scope.arr=[];            $scope.cunzai=false;            $scope.btn=function () {                if($scope.inputs.indexOf("#")==-1){                    confirm("您记录的内容已记录");//                    $scope.cunzai=true;                    $scope.arr.unshift($scope.inputs);                }else{                    alert("不能输入敏感字#");                }                if($scope.inputs==$scope.arr){                    $scope.cunzai=true;                }                $scope.inputs=null;                if($scope.inputs==""){                    console.log($scope.inputs);                    confirm("输入的不能为空");                }            };            $scope.finds=function () {                if($scope.find== $scope.arr){                    alert("搜索到相关内容");                    $scope.cunzai3=true;                }else{                    alert("没有找到相关内容")                    $scope.cunzai4=true;                }            }            $scope.ok=function () {                $scope.cunzai=false;            }            $scope.very=function () {                $scope.cunzai3=false;            }            $scope.no                =function () {                $scope.cunzai4=false;            }        })    </script></head><body ng-app="myapp" ng-controller="myCtrl"><div class="box">    记账本<br>    <ul ng-model="search">        <li ng-repeat="item in arr track by $index">{{item}}</li>    </ul>    输入框<input type="text" ng-model="inputs"><br>    <button ng-click="btn()">记录</button><br>    <div class="box2" ng-if="cunzai">        <h4>提示</h4>        <p>您记录的已存在</p>        <button style="width: 100%" class="buttons" ng-click="ok()">好吧</button>    </div>    搜索框<input type="text" ng-model="find"><br>    <button ng-click="finds()">搜索</button>    <div class="box3" ng-if="cunzai3">        <h4>提示</h4>        <p>搜到相关内容</p>        <button style="width: 100%" class="buttons" ng-click="very()">很好</button>    </div>    <div class="box4" ng-if="cunzai4">        <h4>提示</h4>        <p>没有搜到相关内容</p>        <button style="width: 100%" class="buttons" ng-click="no()">失望</button>    </div></div></body></html>