Question

我正在尝试创建一个链接，单击该链接会将我重定向到带有联系表单的另一个html页面，并且在该表单中有一个主题输入框。根据要单击的链接，我希望在主题框中填充相应的链接标题。

现在尝试搜索了一段时间，却不知道如何使其工作。尝试使用其他地方提到的键值对方法，但肯定做错了，不确定如何做。

下面是我的代码段。 h3“此处的产品标题”是我要填充主题框的内容（在我的实际网站中，我将有多个链接，用不同的单词填充主题行）。

主页

<div class="squareIndexContentBox1" style="background-color: #fff">
    <a href="contact us.html?subject=testing">
        <h3>Title of the product here</h3>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        </p>
        <div class="learn-more">
            <span id="learn-more">Contact us</span>
            <span class="fa fa-hand-o-left"></span>
        </div>
    </a>
</div>

我要填充输入框的页面

<div class="contact-form">
    <h2> Contact Us </h2>

    <form method="POST" action="contact-form-handler.php">
        <input type="text" name="name" placeholder="Name" required>
        <br>

        <input type="email" name="email" placeholder="Email" required>
        <br>

        <input id="subject" type="text" name="subject" placeholder="Subject" required>
        <br>

        <textarea type="text" name="message" placeholder="Message"></textarea>
        <br>

        <div class="g-recaptcha" data-sitekey=""></div>
        <br>

        <input type="submit" name="submit" class="submit-btn" value="Send Message">
    </form>
</div>

谢谢！

Answer 1

这取决于您如何从主页导航到第二页。

如果您使用简单的按钮导航到另一页，然后在URL中传递带有按钮的唯一字段名称，则可以使用$ _GET来获取该变量，并借助该变量搜索数据库中的特定字段唯一字段并填写您的输入。

第二，如果您通过单击提交按钮从主页导航到另一页面，即填写某种表格后，则可以通过向其他页面添加隐藏的输入类型来传递唯一字段名称。

>

示例

First Example:  <a href="second_page.php?prop_id=5 ">Click </a>

借助$ _GET在second_page中获取此变量（prop_id）

Second Example: <input type="hidden" name="email_address" value="<?php echo $email_address;?>" >

现在，通过提交表单，此输入类型也将发送到其他页面。

或者您可以使用会话将唯一字段传递给另一个页面。

* 唯一字段名称是您可以轻松地从数据库中查找值的键。

Answer 2

设法使其使用某些js / jquery进行工作，尽管它的时间比我想象的要长。还有一个问题是，即使我进入页面时也没有单击4个指定链接中的任何一个（例如，通过导航栏），输入框也会自动填充。

主页

        <div class="squareIndexContentBox1" style="background-color: #fff">
            <a href="contact us.html" onclick="autoinput1()">
                <h3 id="this1">Service 1</h3>
                <p>
                    dummy text 
                </p>
            </a>
        </div>

        <div class="squareIndexContentBox1" style="background-color: lightgrey;">
            <a href="contact us.html" onclick="autoinput2()">
                <h3 id="this2">Service 2</h3>
                <p>
                    dummy text  
                </p>
            </a>
        </div>

        <div class="squareIndexContentBox1" style="background-color: lightgrey;">
            <a href="contact us.html" onclick="autoinput3()"> 
                <h3 id="this3">Service 3</h3>
                <p>
                    dummy text 
                </p>
            </a>
        </div>

        <div class="squareIndexContentBox1" style="background-color: #fff">
            <a href="contact us.html" onclick="autoinput4()"> 
                <h3 id="this4">Service 4</h3>
                <p>
                    dummy text 
                </p>
            </a>
        </div>

JavaScript

将产品名称存储为可在html文件中使用的变量

function autoinput1() {
  var productName = document.getElementById('this1').innerText;
  localStorage.something = productName;
}

function autoinput2() {
  var productName = document.getElementById('this2').innerText;
  localStorage.something = productName;
}

function autoinput3() {
  var productName = document.getElementById('this3').innerText;
  localStorage.something = productName;
}

function autoinput4() {
  var productName = document.getElementById('this4').innerText;
  localStorage.something = productName;
}

我要填写输入框的页面。

基于单击的链接添加了一些jQuery来填充“主题”输入字段

<script>
    $(document).ready(function() {
        $("#subject").val(localStorage.something);
    });
</script>

我绝不是说这是解决我的问题的好方法，这只是我能弄清楚的唯一方法。即使是代码，效率也很低，但我仍在尝试学习__（ツ）_ /

非常感谢其他解决方案:)

（甚至只是缩短我的代码）

链接以自动填充另一页中的输入框

2 个答案: