如何使用 jQuery 从表单操作中获取 URL 属性？答案

【问题标题】：How to get URL attribute from form action using jQuery?如何使用 jQuery 从表单操作中获取 URL 属性？
【发布时间】：2021-09-05 10:45:55
【问题描述】：

花了几个小时尝试不同的代码后，我很想得到您的帮助！我尝试使用 jQuery 从包含在表单元素中的页面上的不同 url 获取 URL 属性。 HTML 示例：

<form action="https://www.example.com/register-offer?provider=directEnergie" target="_blank" method="post"></form>

<form action="https://www.example.com/register-offer?provider=engie" target="_blank" method="post"></form>

我使用这段代码来获取第一个点击的网址，但如果我点击另一个表单网址，它总是返回第一个：

function () {
var f = $('form').attr('action');
return f.split('=').pop(); //

【问题讨论】：

您好！如果您可以提供相关的 html，人们会更容易帮助您。
$(...).attr('action') 将始终为您提供第一个 form 的属性。您究竟如何称呼“功能”？（没有名字？）如果它在事件回调中，例如submit，那么使用this：$("form").on("submit", function() { var f = $(this).attr("action")...

标签： javascript jquery url

【解决方案1】：

// url = "https://www.example.com/register-offer?provider=directEnergie";
let url = new URL($("form").attr("action"));

console.log(url.searchParams.get('provider'))

//output:
// directEnergie

【讨论】：

【解决方案2】：

你可以试试这个代码：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
function click_form(element){
    var action = element.action;
    var param = action.split('=').pop();
    alert(param);
}
</script>
</head>
<body>

<form action="https://www.example.com/register-offer?provider=directEnergie" target="_blank" method="post" onclick="click_form(this);">Click Form 1</form>
<br>
<form action="https://www.example.com/register-offer?provider=engie" target="_blank" method="post" onclick="click_form(this);">Click Form 2</form>

</body>
</html>

【讨论】：

【解决方案3】：

这应该可以工作

function click_form(e) {
  console.log(e.action.split('=').pop())
  return e.action.split('=').pop();
}

<form action="https://www.example.com/register-offer?provider=directEnergie" target="_blank" method="post" onclick="click_form(this);">Click Form 1</form>
<br>
<form action="https://www.example.com/register-offer?provider=engie" target="_blank" method="post" onclick="click_form(this);">Click Form 2</form>

【讨论】：

【解决方案4】：

function callback() {
// to get single url
var form = $('form')
var f = $('form').attr('action');
//console.log(f);

// to get each url
$.each(form, function (i,data) {
    console.log($(this).attr('action'));
});

// to get each url provider
$.each(form, function (i,data) {
    console.log($(this).attr('action').split('=').pop());
});
}

callback()

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form action="https://www.example.com/register-offer?provider=directEnergie" target="_blank" method="post"></form>

<form action="https://www.example.com/register-offer?provider=engie" target="_blank" method="post"></form>

【讨论】：