javascript - 防止 href 使用网站地址自动完成
问题描述
我有一个表格,用户必须在其中填写他们的 facebook 和 instagram 链接。当用户没有输入他们的完整地址(例如:)https://www.facebook.com/userfacebook"
并仅填写时facebook.com/userfacebook
,当此数据来自数据库以在 facebook 图像图标链接上显示用户信息时,href
将使用我的网站地址 + 用户填写的内容自动完成之前:
https://www.mywebsite.com/dashboard/home/facebook.com/userfacebook
如果用户使用整个 facebook 链接 ( https://www.facebook.com/userfacebook
) 填写表单,则不会发生此问题。图像图标链接填充了正确的 facebook 路径。
<div class="form-group">
<div class="form-row mt-20">
<div class="col-md-8">
<label for="facebook">Facebook profile</label>
<input class="form-control" type="text" name="facebook" id="facebook" placeholder="Ex: https://wwww.facebook.com/yourname" />
<div class="invalid-feedback">
*Required
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="form-row mt-20">
<div class="col-md-8">
<label for="instagram">Instagram profile</label>
<input class="form-control" type="text" name="instagram" id="instagram" placeholder="Ex: https://wwww.instagram.com/yourname" />
<div class="invalid-feedback">
*Required
</div>
</div>
</div>
</div>
javascript:
axios.post("https://mywebsite.com/backend/get.php", {
token: token,
})
.then((response) => {
if (response.data != "Error getting data") {
loading.innerHTML = "";
response.data.forEach((res) => {
userInfos.innerHTML +=
/* html */
`<div class="share-container">
<a href="${res.facebook}" target="_blank">
<img class="img-fluid" src="./assets/img/facebook-purple.png" alt="share-fb">
</a>
<a href="${res.instagram}" target="_blank">
<img class="img-fluid" src="./assets/img/instagram-purple.png" alt="share-ig">
</a>
</div>`;
});
}
});
有没有办法在不更换字符串或类似的东西的情况下防止这种情况发生?
解决方案
Try autocomplete attribute but with random string as a value
<input class="form-control" autocomplete="randomstringhere" type="text" name="facebook" id="facebook" placeholder="Ex: https://wwww.facebook.com/yourname" />
推荐阅读
- java - 如何使用错误的数据库配置访问网页
- javascript - 在客户端 javascript 上保存 .xml
- linux - 我想为特定的 linux 用户屏蔽我的网站
- powerbi - Power BI/查询,动态选择列
- typescript - 扩展类 - 类型支持
- javascript - AWS Lambda 提前结束(没有任何明确的返回或回调)
- unix - Unix 复制命令
- java - Spring-boot:run 有效,但 java-jar 无效
- objective-c - 文件中缺少所需的架构 armv7?问
- android - 无法解决:android studio 中的运行时