我不确定这是否可行。但我想知道是否有人知道如何使一个超链接传递一些变量和使用POST(像一个表单)而不是GET。
当前回答
您可以创建一个带有隐藏输入的表单,其中包含要发布的值,将表单的动作设置为目标url,并将表单方法设置为发布。然后,当链接被单击时,触发一个提交表单的JS函数。
请看这里的例子。这个例子使用纯JavaScript,不使用jQuery——如果你不想安装更多的东西,你可以选择这个。
<form name="myform" action="handle-data.php" method="post">
<label for="query">Search:</label>
<input type="text" name="query" id="query"/>
<button>Search</button>
</form>
<script>
var button = document.querySelector('form[name="myform"] > button');
button.addEventListener(function() {
document.querySelector("form[name="myform"]").submit();
});
</script>
其他回答
不需要JavaScript。只是想说清楚一点,因为在这个答案发布的时候,这个问题的所有答案都涉及到以某种方式使用JavaScript。
使用纯HTML和CSS可以很容易地做到这一点,只需创建一个包含要提交的数据的隐藏字段的表单,然后将表单的提交按钮设置为链接的样式。
例如:
.inline { display: inline; } .link-button { background: none; border: none; color: blue; text-decoration: underline; cursor: pointer; font-size: 1em; font-family: serif; } .link-button:focus { outline: none; } .link-button:active { color:red; } <a href="some_page">This is a regular link</a> <form method="post" action="some_page" class="inline"> <input type="hidden" name="extra_submit_param" value="extra_submit_value"> <button type="submit" name="submit_param" value="submit_value" class="link-button"> This is a link that sends a POST request </button> </form>
您使用的确切CSS可能会根据站点上常规链接的样式而有所不同。
另一个工作示例,使用类似的方法张贴:创建一个html表单,使用javascript来模拟张贴。这做了两件事:发布数据到一个新的页面,并在一个新的窗口/选项卡中打开它。
HTML
<form name='myForm' target="_blank" action='newpage.html' method='post'>
<input type="hidden" name="thisIsTheParameterName" value="testDataToBePosted"/>
</form>
JavaScript
document.forms["myForm"].submit();
正如许多帖子所提到的,这是不可能直接实现的,但一个简单而成功的方法如下: 首先,我们在html页面的主体中放入一个表单,它没有任何提交按钮,而且它的输入是隐藏的。 然后我们使用javascript函数来获取数据并发送表单。这种方法的优点之一是重定向到其他页面,这取决于服务器端代码。 代码如下: 现在在任何你需要一个to be in "POST"方法的地方:
<script type="text/javascript" language="javascript">
function post_link(data){
$('#post_form').find('#form_input').val(data);
$('#post_form').submit();
};
</script>
<form id="post_form" action="anywhere/you/want/" method="POST">
{% csrf_token %}
<input id="form_input" type="hidden" value="" name="form_input">
</form>
<a href="javascript:{}" onclick="javascript:post_link('data');">post link is ready</a>
我建议一种更动态的方法,没有html编码到页面中,严格保持JS:
$("a.AS-POST").on('click', e => {
e.preventDefault()
let frm = document.createElement('FORM')
frm.id='frm_'+Math.random()
frm.method='POST'
frm.action=e.target.href
document.body.appendChild(frm)
frm.submit()
})
你可以使用javascript函数。JQuery有一个很好的内置post函数,如果你决定使用它:
JQuery的帖子
<script language="javascript">
function DoPost(){
$.post("WhateverPage.php", { name: "John", time: "2pm" } ); //Your values here..
}
</script>
<a href="javascript:DoPost()">Click Here</A>
推荐文章
- 使伸缩项目正确浮动
- Babel 6改变了它导出默认值的方式
- 如何配置历史记录?
- ES6模板文字可以在运行时被替换(或重用)吗?
- [Vue警告]:找不到元素
- 可以在setInterval()内部调用clearInterval()吗?
- AngularJS控制器的生命周期是什么?
- 无法读取未定义的属性“msie”- jQuery工具
- 形式内联内的形式水平在twitter bootstrap?
- 我的蛋蛋怎么不见了?
- JavaScript中的排列?
- 自定义元素在HTML5中有效吗?
- JavaScript中有睡眠/暂停/等待功能吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?