ちょっとした事情があって、Javascriptだけで値をPOSTし、ページ遷移もしたいなということがありました。
HTMLでタグを書いて、<input> とか<submit>とかやればいいんですが、ちょっとした値を渡したいだけなので、面倒だな、というのが事情でした。(大した事情ではなかった)
しかし、ググっても意外と出てこないんですよ。
Googleさんが出してくれるのは、AjaxでPOSTして値を取ってきましょう ってページばっかり…。同じページに、Javascriptでページ遷移しようみたいなのもあったりするので、Hitするんですかね。
「それじゃ…ダメ…っ!違うっ…!HTMLでやるみたいにやりたいんだ…っ!」
と思い、英語でググったところ、StackOverflowさんにドンピシャでありました。
「ククク…カイジくん…!君が求めていたのは…これ…っ!」
「あ…ありがてぇ…っ!!!formタグを作ってそれにパラメーターを含んだinputタグを作るという悪魔的発想!!!サンプルコードをコピペするだけで、やりたいことができちまった…!」
と感動しましたので、ここでも紹介させていただきます。
Rakesh Pai さんに大感謝ですね。┌o ペコッ
下記に掲載されていたサンプルコードを掲載しておきます。
/**
* sends a request to the specified url from a form. this will change the window location.
* @param {string} path the path to send the post request to
* @param {object} params the paramiters to add to the url
* @param {string} [method=post] the method to use on the form
*/
function post(path, params, method='post') {
// The rest of this code assumes you are not using a library.
// It can be made less wordy if you use one.
const form = document.createElement('form');
form.method = method;
form.action = path;
for (const key in params) {
if (params.hasOwnProperty(key)) {
const hiddenField = document.createElement('input');
hiddenField.type = 'hidden';
hiddenField.name = key;
hiddenField.value = params[key];
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}
使う場合は、下記のように使います。
post("index.php", {val:"hogehoge"});
転載元はこちら
https://stackoverflow.com/questions/133925/javascript-post-request-like-a-form-submit/133997#133997
Javascriptだけで次のページにパラメーターをPOSTで渡したいJavascripterのみんなに届け♡
英語で探すって大事だね…(´ω`)