时间戳

首页 > 解决方案 > 在 foreach 中的按钮单击值

javascript - 在 foreach 中的按钮单击值

问题描述

在我的 Ajax 调用中，我想传递两个在按钮单击时获得的参数：

$('.button').on('click', function (e) {
    var id = $(this).data("id");
    var name = $(this).data("name");

    e.preventDefault();

    process.forEach(performStep);
});

这个过程是一个数组，我正在循环遍历以在 forEach 中执行调用：

var process = [
    {
        "url" : "/api/first/call",
        "text" : "First call "
},
    {
        "url" : "/api/second/call",
        "text" : "Second call "
}
];

最后是 Ajax 代码：

function performStep(value, index, array)
{
    $.ajax({
        type: 'POST',
        url: value.url,
        data: JSON.stringify({
            'id': id,
            'name': name
        }),
    processData: false,
    contentType: 'application/json-patch+json',
    success: function () {
       
        }
    },
        error: function (xhr) {
            
        }
    });
}

当我将它放在函数参数中时，它不会捕获它们。如何在 performStep() 函数中传递它？当我console.log()点击 .button() 类时，我会返回它们。

试图将它们添加到process.forEach(performStep); 但它不会工作。我对 JS、Ajax 和 jQuery 很陌生，所以也许我遗漏了什么？

标签： javascriptjqueryajax

解决方案

您当前代码的问题是您通过引用performStep传递给。这意味着传递给处理函数（和）的参数作为参数提供。但是，您的函数似乎期望来自外部范围的and值。forEach()forEach()currentValueindexarrayidname

要传递id和name值，您需要将它们作为参数包含在函数调用和定义中：

var process = [{
  "url": "/api/first/call",
  "text": "First call "
}, {
  "url": "/api/second/call",
  "text": "Second call "
}];

$('.button').on('click', function(e) {
  var id = $(this).data("id");
  var name = $(this).data("name");

  e.preventDefault();

  process.forEach(function(obj) {
    performStep(obj, id, name);
  });
});

function performStep(value, id, name) {
  console.log(value);
  console.log(id);
  console.log(name);
  
  // ajax request...
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="button" data-id="foo" data-name="bar">Click me</button>
<button class="button" data-id="fizz" data-name="buzz">Click me</button>

推荐阅读