Ell*_*iot 190 html javascript http
我不确定这是否可行.但我想知道是否有人知道如何使超链接传递一些变量并使用POST(如表格)而不是GET.
Aje*_*i32 296
你不需要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;
}Run Code Online (Sandbox Code Playgroud)
<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>Run Code Online (Sandbox Code Playgroud)
您使用的确切CSS可能会有所不同,具体取决于您网站上常规链接的样式.
Pal*_*tir 91
您创建一个包含隐藏输入的表单,该表单包含要发布的值,将表单的操作设置为目标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>
Run Code Online (Sandbox Code Playgroud)
AGo*_*ame 45
你可以使用javascript函数.如果你决定使用它,JQuery有一个很好的post函数:
<script language="javascript">
function DoPost(){
$.post("WhateverPage.php", { name: "John", time: "2pm" } ); //Your values here..
}
</script>
Run Code Online (Sandbox Code Playgroud)
<a href="javascript:DoPost()">Click Here</A>
Run Code Online (Sandbox Code Playgroud)
Maj*_*our 24
这是一个老问题,但没有一个答案满足请求.所以我正在添加另一个答案.
根据我的理解,所请求的代码应该只对正常超链接的工作方式进行一次更改:POST应该使用该方法而不是GET.直接影响将是:
hrefPOST我在这里使用jquery,但这可以用原生apis完成(当然更难和更长).
<html>
<head>
<script src="path/to/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("a.post").click(function(e) {
e.stopPropagation();
e.preventDefault();
var href = this.href;
var parts = href.split('?');
var url = parts[0];
var params = parts[1].split('&');
var pp, inputs = '';
for(var i = 0, n = params.length; i < n; i++) {
pp = params[i].split('=');
inputs += '<input type="hidden" name="' + pp[0] + '" value="' + pp[1] + '" />';
}
$("body").append('<form action="'+url+'" method="post" id="poster">'+inputs+'</form>');
$("#poster").submit();
});
});
</script>
</head>
<body>
<a class="post" href="reflector.php?color=blue&weight=340&model=x-12&price=14.800">Post it!</a><br/>
<a href="reflector.php?color=blue&weight=340&model=x-12&price=14.800">Normal link</a>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
要查看结果,请将以下内容保存为您在上面保存的目录中的reflector.php.
<h2>Get</h2>
<pre>
<?php print_r($_GET); ?>
</pre>
<h2>Post</h2>
<pre>
<?php print_r($_POST); ?>
</pre>
Run Code Online (Sandbox Code Playgroud)
Qua*_*nnt 11
另一个工作示例,使用类似方法发布:创建一个html表单,使用javascript来模拟帖子.这样做有两件事:将数据发布到新页面并在新窗口/选项卡中打开它.
HTML
<form name='myForm' target="_blank" action='newpage.html' method='post'>
<input type="hidden" name="thisIsTheParameterName" value="testDataToBePosted"/>
</form>
Run Code Online (Sandbox Code Playgroud)
JavaScript的
document.forms["myForm"].submit();
Run Code Online (Sandbox Code Playgroud)
小智 11
除了使用 JavaScript,您还可以使用发送隐藏表单的标签。非常简单且小的解决方案。该标签可以位于 html 中的任何位置。
<form style="display: none" action="postUrl" method="post">
<button type="submit" id="button_to_link"> </button>
</form>
<label style="text-decoration: underline" for="button_to_link"> link that posts </label>Run Code Online (Sandbox Code Playgroud)