个人中心
gpt4 book ai didi

angularjs - 如何隐藏html5验证弹出消息

转载 作者：行者123 更新时间：2023-12-05 06:42:56 24 4
gpt4 key购买 nike

我在这里创建了带有验证的简单表单，我的要求是我不想要 html5 弹出消息，但我需要关注特定的有效字段，怎么办？感谢您在高级方面的帮助................................................................ .

'use strict';
var app = angular.module('telstraApp', []);
   
 
 
    

app.directive('accessibleForm', function () {
    return {
        restrict: 'A',
        link: function (scope, elem) {

            // set up event handler on the form element
            elem.on('submit', function () {

                // find the first invalid element
                var firstInvalid = elem[0].querySelector('.ng-invalid');

                // if we find one, set focus
                if (firstInvalid) {
                    firstInvalid.focus();
                }
            });
        }
    };
});
 
  
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>TelsApp</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!--<link data-require="bootstrap@*" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />-->
    
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.css">


    <script data-require="angular.js@~1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script> 
  
     
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular-sanitize.js"></script>    
</head>



<body class="hold-transition skin-blue sidebar-mini" data-ng-app="telstraApp">
    <div class="wrapper">
    
    <div class="row" style="   position: relative;   top: 0; height: 55px !important;z-index:9999;">
        
    </div>
        <!--<div id="header" ng-include="'layout/header/header.html'"  ></div> -->
         
        <!-- Left side column. contains the logo and sidebar -->
      
        <aside class="main-sidebar" style="  height: 100%;  top: 10px;   height:0px;  padding-top: 60px;">
          
           
        </aside>

        <div class="content-wrapper" style=" margin-top: -29px; margin-bottom: 10px; height: 350px;   overflow-y: auto; ">
            <!-- Main content -->
            <form>
           <input type="text" ng-required="true">
            <input type="text" ng-required="false">
             <input type="text" ng-required="true">
           
           
           <input type="submit">
           </form>
            <!-- /.content -->
        </div>
    </div>
    <!-- /.content-wrapper -->
    <!-- /.Footer -->
     
    <!-- /.Footer -->
    <script data-require="jquery@1.11.0" data-semver="1.11.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
     
    
   
   

</body>
</html> 

<style>
.appBanner{
    position:fixed; left:0; top: 0px; width: 1440px; border:2px; background-color:#6185BA;height: 46px;color: #000; font-family: 'Helvetica Neue', Arial, sans-serif;font-size: 12px;
}
</style>

最佳答案

为了隐藏 html5 验证消息，您必须像这样在表单上指定 novalidate:

<form name='xyz' novalidate>
  //your form
</form>

在这里阅读更多相关信息:disable html5 validations

您必须在要聚焦的输入上指定 autofocus。看看这个 fiddle ，重点放在 email 输入上。 focus with novolidate

关于angularjs - 如何隐藏html5验证弹出消息，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35402669/

24 4 0
文章推荐： listview - 如何确定用户是否滚动到 ListView 的末尾
文章推荐： Webpack 找不到模块 'loader-utils'？
文章推荐： matlab - 氡变换线检测
文章推荐： php - FILTER_SANITIZE_FULL_SPECIAL_CHARS 和 htmlspecialchars 有什么区别？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com