表单的输入值可以直接附加到href的末尾吗？答案

【问题标题】：Can the input value of a form be appended directly to the end of a href?表单的输入值可以直接附加到href的末尾吗？
【发布时间】：2014-04-09 01:26:36
【问题描述】：

我的网站上有一个使用弹出窗口的即时消息功能。当用户发布 IM 帖子时，他们的图片会添加到帖子中。我可以通过从表单中检索存储的用户图片文件名（UserPicStorage...a不需要单独的查询来获取 $sql['picture']...当这些页面加载时，它已经存在于每个主页上）在 5 个非弹出式主页中的每一个上（一个页面是一个例外，见下文) 我的网站如下：

<form id="UserPicStorage"><input type="hidden" name="UserPic" value="<?=     
$sql['picture'] ?>"></form>

我有一个 关于我们 页面，它不需要加载数据库查询。因此，如果用户在 关于我们 上发布即时消息，为了保存查询，我将 $sql['picture'] 传递给 a href，如下所示：

<a href="about.php?userpic=<?= $sql['picture'] ?>">About Us</a>

如果用户在关于我们上时有即时消息发布，则弹出窗口可以检索用户图片。

但是，用户可以在 6 个主要页面之一上使用 AJAX 来更改他/她的用户图片。所以我不能用这个：

<a href="about.php?userpic=<?= $sql['picture'] ?>">About Us</a>

因为如果用户更改了他/她的照片，$sql['picture']（在页面加载时有效）不再是当前照片。我做了很多搜索，但找不到任何支持类似于以下方法：

<a href="about.php?userpic=document.forms.UserPicStorage.UserPic.value">About Us</a>

我尝试了这个并简单地传递了文字字符串 document.forms.UserPicStorage.UserPic.value。以下内容也是如此：

<a href="about.php?userpic='document.forms.UserPicStorage.UserPic.value'">About Us</a>

有没有办法将表单的输入值直接附加到a href？

【问题讨论】：

当 AJAX 与新链接一起发送时，为什么不能只更新 a href 属性？给链接一个 id/name 并简单地更新它。
我可以试试这个......听起来它会工作......因为每次用户上传新照片时，第 6 页的表单输入值都会更新，最简单的方法是通过直接输入表单的值。我真的很好奇，因为当调用这些函数时，您可以将表单值作为参数直接传递给 js 函数......我认为 href 可能也能够处理这个问题

标签： javascript forms href

【解决方案1】：

你应该只使用

<a href="about.php?userpic=<?= $sql['picture'] ?>">About Us</a>

（好吧，也许你应该编码$sql['picture']）

当您发出 AJAX 请求时，将其更新为成功回调：

ajax.onreadystatechange = function() {
    if (ajax.readyState===4 && ajax.status >= 200 && ajax.status < 300) {
         /* AJAX successful */
         myAnchor.src = "about.php?userpic=" + encodeURIComponent(
             document.forms.UserPicStorage.elements.UserPic.value
         );
    }
};

【讨论】：