提问者:小点点

如何防止输入显示在地址栏中


我想向你们寻求帮助,我已经尝试编写我的javascript,这样它就不会显示来自输入的结果,但我得到的结果实际上是杂乱的,所以我附上了我的代码的原始版本,我没有编辑,它仍然是整洁的,但输入仍然显示在web浏览器的地址栏中。

接下来是我修订前的代码版本:(JavaScript)

null

(function ($) {
    "use strict";

    /*==================================================================
    [ Validate ]*/
    var input = $('.validate-input .input100');

    $('.validate-form').on('submit',function(){
        var check = true;

        for(var i=0; i<input.length; i++) {
            if(validate(input[i]) == false){
                showValidate(input[i]);
                check=false;
            }
        }

        return check;
    });


    $('.validate-form .input100').each(function(){
        $(this).focus(function(){
           hideValidate(this);
        });
    });

    function validate (input) {
        if($(input).attr('type') == 'email' || $(input).attr('name') == 'email') {
            if($(input).val().trim().match(/^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{1,5}|[0-9]{1,3})(\]?)$/) == null) {
                return false;
            }
        }
        else {
            if($(input).val().trim() == ''){
                return false;
            }
        }
    }

    function showValidate(input) {
        var thisAlert = $(input).parent();

        $(thisAlert).addClass('alert-validate');
    }

    function hideValidate(input) {
        var thisAlert = $(input).parent();

        $(thisAlert).removeClass('alert-validate');
    }

    
    
    /*==================================================================
    [ Simple slide100 ]*/

    $('.simpleslide100').each(function(){
        var delay = 7000;
        var speed = 1000;
        var itemSlide = $(this).find('.simpleslide100-item');
        var nowSlide = 0;

        $(itemSlide).hide();
        $(itemSlide[nowSlide]).show();
        nowSlide++;
        if(nowSlide >= itemSlide.length) {nowSlide = 0;}

        setInterval(function(){
            $(itemSlide).fadeOut(speed);
            $(itemSlide[nowSlide]).fadeIn(speed);
            nowSlide++;
            if(nowSlide >= itemSlide.length) {nowSlide = 0;}
        },delay);
    });


})(jQuery);

null

请帮助我也把它放在编码中,我已经做了,抱歉,我仍然是一个初学者,我迷惑如何做它了,所有的帮助将被感激:)

这是HTML代码:

null

<!DOCTYPE html>
<html lang="en">
<head>
    <title>AN Newsletter | Subscribe</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<!--===============================================================================================-->
    <link rel="icon" type="image/png" href="images/icons/favicon.ico"/>
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="fonts/iconic/css/material-design-iconic-font.min.css">
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="vendor/animate/animate.css">
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="vendor/select2/select2.min.css">
<!--===============================================================================================-->
    <link rel="stylesheet" type="text/css" href="css/util.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
<!--===============================================================================================-->
</head>
<body>



    <div class="flex-w flex-str size1 overlay1">
        <div class="flex-w flex-col-sb wsize1 bg0 p-l-70 p-t-37 p-b-52 p-r-50 respon1">
            <div class="wrappic1">
                <a href="../main/index.html">
                    <img src="images/icons/logo.png" alt="IMG">
                </a>
            </div>

            <div class="w-full p-t-100 p-b-90 p-l-48 p-l-0-md">

                <h3 class="l1-txt1 p-b-34 respon3">
                    Post Box
                </h3>

                <p class="m2-txt1 p-b-46">
                    Follow me for update now!
                </p>

                <form class="contact100-form validate-form m-t-10 m-b-10" action="../success/success.html">
                    <div class="wrap-input100 validate-input m-lr-auto-lg" data-validate = "Email is required: ex@abc.xyz">
                        <input class="s2-txt1 placeholder0 input100 trans-04" type="text" name="email" placeholder="Email Address">

                        <button class="flex-c-m ab-t-r size2 hov1 respon5">
                            <i class="zmdi zmdi-long-arrow-right fs-30 cl1 trans-04"></i>
                        </button>

                        <div class="flex-c-m ab-t-l s2-txt1 size4 bor1 respon4">
                            <span>Subcribe Now:</span>
                        </div>
                    </div>
                </form>

            </div>

            <div class="flex-w flex-m">
                <span class="m2-txt2 p-r-40">
                    Follow me
                </span>

                <a href="https://www.facebook.com/stevenWilliamG" class="size3 flex-c-m how-social trans-04 m-r-15 m-b-5 m-t-5">
                    <i class="fa fa-facebook"></i>
                </a>

                <a href="https://twitter.com/AdrikAleandra" class="size3 flex-c-m how-social trans-04 m-r-15 m-b-5 m-t-5">
                    <i class="fa fa-twitter"></i>
                </a>

                <a href="https://www.instagram.com/audynaufal7/" class="size3 flex-c-m how-social trans-04 m-r-15 m-b-5 m-t-5">
                    <i class="fa fa-instagram"></i>
                </a>

                <a href="https://www.linkedin.com/in/audy-naufal-ghiffari-ceh-875072141/" class="size3 flex-c-m how-social trans-04 m-r-15 m-b-5 m-t-5">
                    <i class="fa fa-linkedin"></i>
                </a>

            </div>
        </div>


        <div class="wsize2 bg-img1 respon2" style="background-image: url('images/bg01.jpg');">
        </div>
    </div>





<!--===============================================================================================-->
    <script src="vendor/jquery/jquery-3.2.1.min.js"></script>
<!--===============================================================================================-->
    <script src="vendor/bootstrap/js/popper.js"></script>
    <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<!--===============================================================================================-->
    <script src="vendor/select2/select2.min.js"></script>
<!--===============================================================================================-->
    <script src="vendor/tilt/tilt.jquery.min.js"></script>
<!--===============================================================================================-->
    <script src="js/main.js"></script>

</body>
</html>

null

附注:

请不要屏蔽我,我还是新的,我还得学习这个平台,我还得在我的项目上工作,所以我想这个平台会对我完成我的项目非常有用,谢谢。


共2个答案

匿名用户

如果您引用的是浏览器地址栏,其输入电子邮件地址的结果如下:/success/success.html?email=xxxx

这是因为您还没有指定表单的方法,所以表单使用PHP GET,在其他页面上传递值是正常的。

如果不想显示此数据,则应如下所示指定表单提交方法:

    <form class="contact100-form validate-form m-t-10 m-b-10" 
action="../success/success.html" method="POST">

请记住,你必须在另一边获取数据作为邮政也。 在这里阅读更多关于这一点的内容。

匿名用户

将GET方法替换为POST方法。