AJAX请求来自具有相同类的多个div的多个值

Question

So, lets say that we have this structure:

  <div id='allTempLinkHolder'>
    <div class='tempLink'>Value</div>
    <div class='tempLink'>Value 2</div>
    <div class='tempLink'>Value 3</div>
 </div>

How i can submit all of the different values of .tempLink with post ajax, for example to post them to fetch.php ? Thanks!

Answer 1

var params;

$(".tempLink").each(function(){
  params=$.extend({}, params,   { "tmplink[]" , $(this).text() }  );
});

$.ajax({
    type: "POST",
    url: "url",
    data: params,
    success: function() {
      //Success code here
    }
});

in PHP you will receive it in an array $_POST["tmplink"]

Answer 2

Try this:

http://jsfiddle.net/htKRf/3/

var links = []

// Put all the tempLinks into an array. 
$.each($('.tempLink'), function (index, element) {
    links.push($(element).text());    
});

// Post it to the url.
$.post('fetch.php', JSON.stringify(links), function() { console.log("SUCCESS"); });

​

Answer 3

if you simmply want an array sent:

var values = $.map($('.tempLink'), function(el, idx) {
    return $(el).text()
})

$.post('fetch.php', { values: values}, function(data) {
        /* do something with return data*/
})

Answer 4

var values=[];
$(".tempLink").each(function(){
    values.push($(this).text());
});

$.post({
    url: 'yourPhpScript.php',
    data: {values:values},
    success: function(data) {
        console.log(data);
    }
});

In your php script use

$arr = $_POST['values'];

$value1=$arr[0]; // value
$value2=$arr[1]; // value1
$value2=$arr[2]; // value3

Answer 5

Either a separate Ajax call for each div

 $("div.tempLink").each(function(index, elem) {
    $.ajax({
        url: "my url" + "?param=" + this.text(),
        success: function() {...
        }
    });
});​

or a single call with array of values

var values = new Array();
$("div.tempLink").each(function(index, elem) {
    values.push(this.text());
});

$.ajax({
    type: "POST",
    url: "my url",
    data: JSON.stringify(values),
    contentType: "application/json; charset=utf-8",
    success: function() {...
    }
});​

​

Answer 6

First you would use a jQuery class selector to collect the values into a suitable data structure. I wasn't sure how you wanted to do that, so I used a javascript map and linked the position in the original list to the value of the text {"link1":"value1","link2":"value2",...} .

var map={};
$(".tempLink").each(function(index) {
    map["tempLink"+index] = $(this).text();
});

To figure out the usage and syntax of $.ajax see the jquery ajax api ref.

$.ajax({
    type: "POST",
    url: "fetch.php",
    data: JSON.stringify(map),
    dataType: "...", //The type of data you're expecting the server to respond with
    contentType: "application/json; charset=utf-8",
    success: function(data, status, jqXHR) {},
    error: function(jqXHR, status, error) {}
});​

When your ajax call returns, if it's successful the success callback fires, otherwise error fires. You can use these to handle the data your server responds with, or let the user no that the request failed.