javascript - $.ajax() 给出 [object HTMLInputElement] 而不是值

Question

我有一个 $.ajax() 请求正常工作，它正在调用 3 个 id。唯一没有问题的 id 是名称 id。 clientId 在控制台上记录良好，但在表上打印 undefined 。 url 正在 table 和控制台上打印 [object HTMLInputElement]，日志如下 <input class="form-control no-border" type="text" id="redirectUrl" name="url" placeholder="http://stuffpage/redirect/?id=1" required=""> .我想打印我在输入中引入的网址。

你能告诉我问题是什么吗？

$('#saveButton').on('click', function() {

  var url = "http://stuffpage.com/redirect/redirect";

  var name = $('#name').val();
  console.log("name", name);
  var clientId = $('#clientId').val();
  console.log("clicentId", clientId);
  var redirecUrl = $('#redirectUrl').val();
  console.log("redirectUrl", redirectUrl);

  var formData = new FormData();
  formData.append('name', name);
  formData.append('client_id', clientId);
  formData.append('url', redirectUrl);
  console.log('test')
  $.ajax({
    url: url + "/saveRedirect",
    type: "POST",
    dataType: "json",
    data: formData,
    contentType: false,
    cache: false,
    processData: false,
    success: function(obj) {
      var name, clientId, redirecUrl;
      var rows = '';
      for (i = 0; i < obj.length; i++) {
        rows += "<tr class='lightgrey'><th>" + obj[i].name + "</th><td>" + obj[i].clientId + "</td><td>" + obj[i].url + "</td><td><img id='editButton' class='col-md-2 edit nopad' src='http://stuffpage.com/redirect/public/img/edit.svg'><img class='col-md-2 link nopad float-right' src='http://stuffpage.com/redirect/public/img/copy.svg'></td></td></tr>";
        $("#table").append(rows);
        console.log('sucess!');
      }
    },
    error: function() {
      console.log('error');
    }
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="col-md-12 marg-t-30 nopad">
  <!--REGISTER NAME CLIENT ID URL-->
  <div class="col-md-1 nopad">
    <div class="rtitle">
      <div class="roboto-condensed">name</div>
    </div>
  </div>
  <div class="col-md-3 nopad" style="margin-right: 20px;">
    <input class="form-control no-border" id="name" type="text" name="nameClient" placeholder="Insert name..." required="">
  </div>
  <div class="col-md-1 nopad">
    <div class="rtitle">
      <div class="roboto-condensed">client id</div>
    </div>
  </div>
  <div class="col-md-3 nopad">
    <select class="form-control no-border selectpicker" name='clientId' id='clientId' data-show-subtext="true" required="">
						<?php echo $client_data;?>
					</select>
  </div>
  <div class="col-md-3 nopad">
    <button id="saveButton" class="save float-right">SAVE</button>
  </div>
  <div class="col-md-12 nopad marg-t-20">
    <div class="col-md-1 nopad">
      <div class="rtitle">
        <div class="roboto-condensed">url</div>
      </div>
    </div>
    <div class="col-md-11 nopad">
      <input class="form-control no-border" type="text" id="redirectUrl" name="url" placeholder="http://stuffpage/redirect/?id=1" required="" value="">
    </div>
  </div>
</div>
<!--col-md-12-->

Answer 1

您似乎有一个拼写错误:

var redirecUrl = $('#redirectUrl').val();

应该是

var redirectUrl = $('#redirectUrl').val();