对于每个数据，使用jQuery Ajax。

Question

我将尝试使用jQuery Ajax向PHP发送数据。问题出现在以下代码中。
（您可以忽略PHP）
HTML

<ul class="blah">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<div class="result"></div>

JQUERY

$(".blah li").each(function(){
  var each_li = $(this).text();
});

$.ajax({
    url: 'select-query.php',
    method: 'POST',
    data: {li_variable: each_li},
    success: function(response){
        $('.result').html(response);
    }
});

each_li函数在ajax函数中仅返回一个值。我可以将ajax放入每个函数中，但对于每个li元素，它都会执行ajax调用。如何将所有li值传递给ajax数据并仅调用一次ajax。

PHP(select-query.php)

<?
$query = "SELECT username FROM table WHERE id = '".$_POST['li_variable']."'";
$query_run = mysqli_query($connect,$query);
while($query_array = mysqli_fetch_assoc($query_run)){
    echo $query_array['username'];
}
?>

- wordpress user

---

你需要一个数据数组吗？ - Rajaprabhu Aravindasamy

使用 each_li[] 并将其声明为数组。 - Thamilhan

Answer 1

您可以将数据推入数组中，然后按以下方式将其发送到ajax请求中：

您可以将数据推入数组中，然后按以下方式将其发送到ajax请求中：

var each_li = [];
$(".blah li").each(function(){
   each_li.push($(this).text()); //pushing the data in js array
});

$.ajax({
    url: 'select-query.php',
    method: 'POST',
    data: {li_variable: each_li},
    success: function(response){
        $('.result').html(response);
    }
});

- vijayP

Answer 2

您可以使用 map 和 get 方法来收集所有元素的文本内容。

var each_li = $(".blah li").map(function(){
  return this.textContent;
}).get();

不要担心使用 .get 会再次迭代以收集保留的值。它只是将该值集合从Jquery对象中解开，底层不会发生任何迭代。

- Rajaprabhu Aravindasamy

---

简短而美妙，这个简洁性非常强大！ - marvinhagemeister

Answer 3

创建 li 值的数组并将其发送到 ajax：

myArray = new Array();
cnt = 0;
$(".blah li").each(function(){
      myArray[cnt] = $(this).text();
cnt++;
});
var jsonString = JSON.stringify(myArray);

$.ajax({
    url: 'select-query.php',
    method: 'POST',
    data: {li_variable: jsonString},
    success: function(response){
        $('.result').html(response);
    }
});

In php:

$data = json_decode(stripslashes($_POST['li_variable']));

  foreach($data as $d){
     echo $d;
  }

- Dhara Parmar