使用 html 和 css 将术语输入隐藏表单字段？

Posted 2023-03-10

【中文标题】使用 html 和 css 将术语输入隐藏表单字段？

【英文标题】：enter term into hidden form field with html and css possible?

【发布时间】：2016-06-29 17:07:13

【问题描述】：

我在我的网站上创建了一个 html/CSS 表单。

现在，我的想法是给出包含一些字符串的链接（基本上就像一个附属链接），并希望将该字符串输入到要提交的隐藏表单字段中，或者以其他方式将该字符串包含在提交的数据。 有没有简单的方法可以做到这一点？

【问题讨论】：

不，你需要 javascript。

这并不难，但需要一些 JavaScript。

似乎有一个答案 - 下面......使用 php 或 javascript - 我在问是否有办法......;）

【参考方案1】：

有两种方法可以解决这个问题，这两种方法都在您分发的链接中使用GET 变量。

首先，让我们假设——例如目的——你的特殊字符串是abc123。然后，您将分发遵循http://example.com/my/form/?affiliate=abc123 形式的链接。

假设这里有两种解决方案，一种使用 PHP，另一种使用 Javascript。

---

PHP 解决方案

这很简单，只要你设置一个隐藏字段。

<input type='hidden' name='affiliate' value='<?= htmlspecialchars($_GET['affiliate'], ENT_QUOTES, 'UTF-8'); ?>' />

更新：添加了 htmlspecialchars() 调用以转义任何输入，以防止用户手动设置 GET 变量时出现安全问题。

---

Javascript 解决方案

HTML

<input type='hidden' id='affiliate-input' name='affiliate' />

Javascript

此解决方案依赖于jQuery。如果您想要纯 JS 解决方案，请告诉我。

var $_GET = ;

// When the page loads, set the input value
$(document).ready(function()
    setupGetVariables();

    var affiliateId = $_GET["affiliate"];

    $("#affiliate-input").val(affiliateId);
);

function setupGetVariables()

    if(document.location.toString().indexOf('?') !== -1) 
        var query = document.location
                   .toString()
                   // get the query string
                   .replace(/^.*?\?/, '')
                   // and remove any existing hash string (thanks, @vrijdenker)
                   .replace(/#.*$/, '')
                   .split('&');

        for(var i=0, l=query.length; i<l; i++) 
           var aux = decodeURIComponent(query[i]).split('=');
           $_GET[aux[0]] = aux[1];
       
    

setupGetVariables() 方法得到了this answer 的帮助。

【讨论】：

危险：PHP 是vulnerable to XSS。用户输入在插入 HTML 文档之前需要转义！

JavaScript 也不是很好，无法对数据进行 URL 解码。

我应该把它包裹在addSlashes()吗？

地狱没有。 addslashes 是一个糟糕的工具，用于转义使用斜杠作为转义序列的东西（这是它的设计目的），而 HTML 不使用斜杠作为转义序列！ ***.com/questions/1996122/…

@Quentin 好的，感谢您的提醒。我还将 Javascript 换成了实际解析 URL 的东西。 CSSTricks 正在分发糟糕的代码 :(