无法处理输入"更改"文档加载后的事件或值

时间:2016-08-18 10:32:19

标签: javascript jquery

我的表单上有两个输入,我想在文档加载时更改它的值。

这是我的代码:

<?php
$base = dirname(dirname(__FILE__));
include($base."/include/db.php");
?>
<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>eMail Stationery | Installation for iPhone/iPad</title>

    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../font-awesome/css/font-awesome.css" rel="stylesheet">

    <link href="../css/plugins/steps/jquery.steps.2.css" rel="stylesheet">

    <link href="../css/animate.css" rel="stylesheet">
    <link href="../css/style.css" rel="stylesheet">
</head>

<body class="gray-bg">

    <div class="">
        <center>
            <img src="../img/esignia.png">
            <h3>iPhone/iPad Installation</h3>

            <p>Follow the steps provided to install your signature</p>
        </center>
    </div>
    <div id="wizard">
        <h3>Enter your details</h3>
        <section>
            <center>
                <div class="row"></div>
                <p><h2>Enter your details</h2></p>
                <p>Enter your email address and unique pin number into the fields below to receive an email with a link to your signature.</p>
                <div class="row">
                    <div class="col-lg-4"></div>
                    <div class="col-lg-4">
                        <form id="submitForm" method="post">
                            <center>
                                <div class="form-group">
                                    <input id="email" name="email" type="email" placeholder="Email address" class="form-control" required>
                                </div>
                                <div class="form-group">
                                    <input id="pin" name="pin" type="number" placeholder="Unique PIN" class="form-control" required>
                                </div>
                                <button class="btn btn-success">Submit</button>
                                <p>

                                </p>
                            </center>
                        </form>
                    </div>
                </div>
            </center>
        </section>
        <h3>Copying your signature</h3>
        <section>
            <center>
                <p><h2>Copying your signature</h2></p>
                <p>Once you have followed the link we provided in the email, you will see your signature displayed fully on your device's web browser.</p>
                <p>Simply highlight all of your signature and copy it to your device's clipboard as demonstrated below.</p>
                <p><img src="../img/install/iphone_2.png" width="320px" height="480px"></p>
            </center>
        </section>
        <h3>Locating your signature settings</h3>
        <section>
            <center>
                <p><h2>Locating your signature settings</h2></p>
                <p>Great! We've copied your signature and it is now ready to be installed!</p>
                <p>We just need to find your mail's signature settings.</p>
                <p>These are located at <b>Settings -> Mail, Contacts, Calendars -> Signature</b>
                    <p><img src="../img/install/iphone_3.png" width="320px" height="480px">
                        <img src="../img/install/iphone_4.png" width="320px" height="480px"></p>
                    </center>
                </section>
                <h3>Installing your signature</h3>
                <section>
                    <center>
                        <p><h2>Installing your signature</h2></p>
                        <p>Now that we have your signature settings open, you'll find an empty box ready for your signature to be pasted.</p>
                        <p>So all you need to do now is paste what we copied earlier into the box.</p>
                        <p><img src="../img/install/iphone_5.png" width="320px" height="480px"></p>
                        <p>One final thing you'll need to do is give your phone a quick shake to undo any of the modifications that your device will attempt to make to your signature's HTML code.</p>
                        <p>This is necessary for your signature to appear <i>exactly</i> how it appeared when you opened it.</p>
                        <p><img src="../img/install/iphone.gif"></p>
                        <p class="text-navy"><b>Congratulations, you've now successfully installed your signature to your device!</b></p>
                    </center>
                </section>
            </div>
        </div>
    </div>

    <!-- Mainly scripts -->
    <script src="../js/jquery-2.1.1.js"></script>
    <script src="../js/bootstrap.min.js"></script>

    <script src="../js/plugins/steps/jquery.steps.js"></script>

    <script>
        $(document).ready(function() {
            var email = getUrlParameter("email");
            var pin = getUrlParameter("pin");
            if(email != undefined && pin != undefined) {
                $("#email").val(email);
                $("#pin").val(pin);
            }
            $("#wizard").steps({
                headerTag: "h3",
                bodyTag: "section",
                transitionEffect: "slideLeft",
                autoFocus: true
            });
            $("#submitForm").submit(function() {
                var email = $("input[name='email']").val();
                var pin = $("input[name='pin']").val();
                $.get("../api/installed.php", {
                    email: email,
                    pin: pin
                });
            });
            $("a[href='#finish'").click(function() {
                window.location.href = "index.php";
            });
        });
        var getUrlParameter = function getUrlParameter(sParam) {
                var sPageURL = decodeURIComponent(window.location.search.substring(1)),
                sURLVariables = sPageURL.split('&'),
                sParameterName,
                i;

                for (i = 0; i < sURLVariables.length; i++) {
                    sParameterName = sURLVariables[i].split('=');

                    if (sParameterName[0] === sParam) {
                        return sParameterName[1] === undefined ? true : sParameterName[1];
                    }
                }
            };
    </script>

</body>

</html>

这不起作用。

但是,我在chrome的控制台中复制了相同的代码,它完美无缺。我唯一的假设是在加载文档后,这些控件与Bootstrap / jQuery混淆和/或重新创建。

但我无法弄清楚在哪里或为什么,或者我应该做些什么。

1 个答案:

答案 0 :(得分:-1)

这可能是因为DOM尚未就绪,请尝试使用以下代码

$(window).load(function() {
            var email = getUrlParameter("email");
            var pin = getUrlParameter("pin");
            if(email != undefined && pin != undefined) {
                $("#email").val(email);
                $("#pin").val(pin);
            }
        }

如果仍然无法正常工作,请尝试更改您的元素ID,以检查天气是否与其他元素发生冲突