使用AJAX / jQuery从同一个类中获取值

时间:2016-01-15 23:14:50

标签: jquery

我如何从同一个班级获得价值? 它只是从一个类(第一个)获得值

查看代码:



$(document).ready(function() {
    $('.getdata').click(function() {
        var name  = $('.name').val();
        var userid = $('.userid').val();
        console.log(name);
        console.log(userid);
        var dataString = 'userid=' + name + '&name=' + name;
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data: dataString,
            dataType: "json",
            success: function(data) {
            }
        }); 
        return false;
    });
});




这是一个循环



<form action='' method='POST'>
    <input type='hidden' class='name' value='".$row["name"]."' />
    <input type='hidden' class='userid' value='".$row["userid"]."' />
    <button type='submit' class='getdata'></button>
</form>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

一种方法是使用公共父元素将每个类与单击的按钮相关联。您可以像这样更新点击处理程序:

$('.getdata').click(function() {
    var name  = $(this).parent().find('.name').val();
    var userid = $(this).parent().find('.userid').val();
    console.log(name);
    console.log(userid);
    var dataString = 'userid=' + name + '&name=' + name;
    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: dataString,
        dataType: "json",
        success: function(data) {
        }
    }); 
    return false;
});

注意,您也可以通过siblings()方法实现目标。

答案 1 :(得分:0)

只要您从表单传递所有数据并使用jquery,一个常见的方法是使用jQuery的serialize()表单中的数据。而不是将您的处理程序放在提交按钮上,而是将其放在表单上......

<form action='' method='POST' id='myForm' >
    <input type='hidden' class='name' value='".$row["name"]."' />
    <input type='hidden' class='userid' value='".$row["userid"]."' />
    <button type='submit' class='getdata'></button>
</form>



$('#myForm').on('submit', function( event ) {

  var formData = $(this).serialize();

  $.ajax({
        type: "POST",
        url: "ajax.php",
        data: formData,
        dataType: "json",
        success: function(data) {
        }
    }); 

  // if you are doing ajax, you don't want to submit the 
  // form and reload the page also.  so you need to add the
  // event to the handler, and call
  // event.preventDefault();
  event.preventDefault();
});