单击按钮后将输入字段值附加到网址

时间:2018-10-11 00:38:25

标签: javascript php jquery forms

我对编码非常陌生,所以如果这是一个愚蠢的问题,请原谅我。

我正在做一个作业,我必须在现有的引导HTML文档中添加功能和样式。目的是允许人们通过输入金额或单击用设置的金额填充字段的按钮来在输入字段中输入美元金额。我的指示之一是更新捐赠提交按钮,以便将所选的捐赠金额附加到“ /谢谢” URL。

这是我在输入字段中所拥有的:

<form id="amountSend">
<input type="text" class="form-control donation-amount-input" placeholder="Other" id="other-amount"/>
</form>

这就是按钮的用途:

 <button id="donateBtn" type="submit" action="/thank-you" 
 method="get">DONATE<span class="metric-amount"></span></button>

我一直认为jQuery看起来像这样,尽管Submit函数当前没有给我任何可见的结果。

$("#donateBtn").click(function() {
        if (!$.isNumeric($("#other-amount").val())) {
            $("#dataWarning").show();
            $(".metric-amount").hide();
            $(".metric-message").hide();
        } else {
                $("#amountSend").submit(function() {
                    var url = "/thank-you";
                    $(".metric-amount").appendTo("url");
                });
        }
    })

使用PHP方法也得到了不错的结果:

<form id="amountSend" method="post" action="/thank-you.php">
<input type="text" class="form-control donation-amount-input" placeholder="Other" id="other-amount" name="donation"></input>
</form>
<button id="donateBtn" type="submit">DONATE<span class="metric-amount"></span></button>

<script>
$("#donateBtn").click(function() {
        if (!$.isNumeric($("#other-amount").val())) {
            $("#dataWarning").show();
            $(".metric-amount").hide();
            $(".metric-message").hide();
        } else {
            $("#amountSend").submit();
            }
        });
</script>

这将打开我设置的PHP文件(/thank-you.php,我将其存储在与主HTML文档相同的根文件夹中),但是所有浏览器给我的都是HTML的原始HTML代码PHP文件。这是我在PHP文件中的代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>

Thank you for your donation of
<?php echo $_POST["donation"]; ?><br>

</body>
</html>

无论如何,我想我想知道自己是否走在正确的轨道上?我应该使用jQuery还是PHP方法?我什至可以只使用jQuery吗?我已经看过有关该主题的几篇文章,但是我想我要写一篇新文章,因为我所看到的文章都相当模糊,我两次都没有看到相同的答案,而且我不确定就结果的视觉确认而言,我完全理解我要完成的工作。

谢谢!

1 个答案:

答案 0 :(得分:1)

首先,您的代码有几个问题。

第一 :您所编写的公式编码错误,表单标签需要具有操作方法< / strong>属性,而不是“提交”按钮。

最重要的是,“提交”按钮需要位于表单标签的内部,如果不在其中,则将没有效果。

第二个 :如果要将配方提交到php文件并在那里处理请求,则需要文件在服务器(本地或本地)上运行随你)。 PHP是一种服务器语言,如果您直接在浏览器中打开文件,它将向您显示其中包含的代码,并且将无法正常工作。

希望有帮助!