Question

我正在尝试通过AJAX将多个输入值发送到我的PHP脚本。当我使用getElementById时它工作正常。但是我可以选择添加一个孩子。它迭代输入字段，然后我只从第一个子节点获取值。我尝试使用getElementsByClassName，但它的值为undefined。这是我的代码：

<div id="name-field" class="name-field row">
  <div class="col-xs-12 col-sm-6 childname">
    <div class="field text-left">
      <label class="text-left">Name of child</label>
      <input id="firstname" class="firstname" name="firstname" type="text" />
    </div>
  </div>
  <div class="col-xs-12 col-sm-6 dateofbirth">
    <div class="field text-left">
      <label class="text-left">Date of birth</label>
      <input type="text" class="date" id="thedate" />
    </div>
  </div>
</div>

<a href="#" id="addChild" name="addchild" class="btn-success">Add Child</a>

<a href="#" id="stepname" class="btn" onclick="btnSubmit('step1')">Next Step</a>

//Iterate child function
jQuery(function($) {
  $("#addChild").click(function() {
    $(".name-field:first").clone().find("input").val("").end()
      .removeAttr("id")
      .appendTo("#additionalselects")
      .append($('<a class="delete" href="#"><i class="fa fa-times"></i></a>'));
  });
  $("body").on('click', ".delete", function() {
    $(this).closest(".name-field").remove();
  });
});

//Sending values function
function btnSubmit(step) {
  //Set Var with Name
  //Set Var with DoB
  if (step == 'step1') {

    //values using ID
    var Name = document.getElementById("firstname").value;
    var DoB = document.getElementById("thedate").value;

    //Values using classname
    var Name = document.getElementsByClassName("firstname").value;
    var DoB = document.getElementsByClassName("date").value;

    //Create a Variable catVar Having the Var Name and Var DoB Concatinated with a --

    var stepVar = Name + "--" + DoB;

    $(".thevoornaam, .date").each(function() {
      alert();
    });
  } else {

  }
  var xmlhttp;
  if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
  } else { // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {



    }
  }
  xmlhttp.open("GET", "validations/btnSubmit.php?q=" + step + "&q2=" + stepVar, true);
  xmlhttp.send();
}

如果我没有正确解释，我希望你们明白我想要实现的目标。

提前致谢。

Answer 1

使用jQuery，你可以这样做。

df.unique <- data.frame(word2=c("beautiful","nice","strong","awesome"),
             n=c(665,468,649,10))
df.unique

在名字中，您将获得所有值。

更新

这是一支工作笔。

https://codepen.io/smitraval27/pen/dmvwVB

Answer 2

document.getElementsByClassName("firstname")

返回一个数组...所以下面将给出索引为i的元素值。要获得所有值，您需要执行ForEach。

document.getElementsByClassName("firstname")[0].value

由于您在其他地方使用JQuery，为什么不使用...

$('.firstname')[0].val();

Answer 3

最理想的方法是：

将表单包装器添加到您的字段（where not left(textcol, 5) <=> 'apple'）
为您的所有表单提供id="ajaxForm" 字段并使用以下代码生成要传递的name 你的AJAX电话

data

$("#ajaxForm").serialize()的返回值可以直接用作ajax调用的$.serialize()

＆＃13;

data

＆＃13;

$("#ajaxForm").on("submit", function () {
  var ajaxData = $("#ajaxForm").serialize();
  
  $("#ajaxData").text(ajaxData);
  
  
  $.ajax({
    url:"",
    type: "get",
    data : ajaxData,
    success: function (resp) {}
  });
  console.log(ajaxData);
});

＆＃13;

如何通过ajax发送具有相同类名或id的多个输入值

3 个答案:

更新