Question

我正在尝试为登录页面发帖。用户手动输入用户名/密码。但是，当用户输入他/她的用户名时，我希望将以下字段设置为name = username。

我在下面有这些字段。我有一个隐藏的字段，并希望用用户手动输入的用户名替换用户名位。

<input class="form-control" type="hidden" required name="username" placeholder="Username">
<input class="form-control" type="password" required name="password" placeholder="Password">

<input class="form-control" type="hidden" required name="arg" placeholder="name">

所以它必须是

username=stack
password=userset
arg='name=stack'

Answer 1

如果我正确理解您想要做什么，听起来您希望每次用户更改用户名文本输入框中的值时都获取input DOM对象并更改其占位符属性

您可以使用getElementsByName('NAME')[0]获取DOM元素（假设名称是唯一的，或者更好地使用ID来确保它们是唯一的）。

然后附加一个功能来监听更改并使用placeholder

交换inputDomObject.addEventListener("change", functionToHandleChanges);的新值

您可以使用placeholder

在输入的DOM对象上（因此在页面上）设置placeholderDomObject.setAttribute("placeholder", "thingToSetItTo");值

如果您需要任何澄清，请发表评论：）

Answer 2

您可以尝试使用jQuery。这里我有一个例子，用户仍然没有提交表单。

$(document).ready(function() {

    $("input[name='username']").keyup(function() {
         $("input[name='arg']").val("'name=" + $(this).val() + "'");
    });

});

如果你真的想获得$ _POST值，你必须使用一些php序列化它们。

<script type="text/javascript">
    var $post = <?php echo json_encode($_POST); ?>;
</script>

然后您可以使用$ post [＆＃34; username＆＃34;]访问您的变量。但我不知道为什么你会使用这个解决方案，因为你可以使用常规的PHP来做到这一点。

在您的代码中，这应该如下所示：

<script type="text/javascript">

     $(document).ready(function() {
        $('form#form1').submit(function(){
            $.ajax({type: "Post",
                    url: $('form').attr('action'),
                    data: $(this).serialize(),
                    success: function(data, status, xhr) {
                        alert("Login successful. Please press OK to be redirected. Redirecting in 5 seconds.");
                        window.setTimeout(function(){window.location.href = "/login"},5000);},
                        error: function(data, status, xhr) {
                            $('form').trigger("reset");
                            alert("Failed to login. Please try again.");
                        }
                    });

                return false;
                alert("AJAX request successfully completed");
            });



          $("input[name='username']").keyup(function() {
              $("input[name='arg']").val("'name=" + $(this).val() + "'");
          });
     });

</script>

HTML表单调用隐藏字段

2 个答案: