将 json 对象的值附加到输入字段答案

【问题标题】：Appending values of json object to input field将 json 对象的值附加到输入字段
【发布时间】：2014-04-19 23:39:06
【问题描述】：

我正在尝试将 json 对象（name & color）的值附加到表单中的两个输入字段。这是在我的网络服务器中进行的 api 调用的模型。 jQuery 函数获取第一个输入字段的值，然后连接 url + json 文件位置，最后进行 api 调用。控制台显示值已成功检索，但我不确定如何将它们相应地附加到其输入字段。 SITE

json：

{
    "name": "test1",
    "color": "red",
}

jQuery/AJAX

$(document).ready(function() {

  /** get the inputs we might need */
  var $result = $('#result');
  var $input = $('#input');

  $result.data('url', $result.val());

  var timer;

  /** function to submit data to the server and
      update the result input on success */
  function submitForm( input, newValue) {
    $.ajax({
      type: "GET",
      url: newValue,
      data: {input:input},
      dataType: 'json',
      success: function (data) {
        $result.val(newValue);
      }
    });
  };

  /** on key up, fill #result with the url + input */
  $input.bind('keyup', function() {
    var $this = $(this);
    var inp = $this.val();
    var url = $result.data('url');
    var newValue = url + inp + '/info.json';

    if(timer) { clearTimeout(timer); }
    timer = setTimeout(function(){
      submitForm(inp, newValue) ;
    }, 500);
    return false;
  });
});

【问题讨论】：

ajax 响应会将 json 传递给您的 data 参数，因此您需要对其进行迭代 - 如果键是 name，请设置名称字段的值。跨度>
$result.val(data.name) 或data.color 如果需要其他
@charlietfl 我试过了，但没有显示任何内容
在成功处理程序中试过了吗？确定返回的数据就是您所显示的？
@charlietfl 没有显示。它在成功处理程序内部。检查Link 我只希望name 显示在输入字段中，id 为name 并在输入字段中显示颜色color

标签： javascript jquery ajax json

【解决方案1】：

我认为问题在于从对象（来自 JSON）中获取元素并将这些值提供给输入？

<input type="text" id="name">
<input type="text" id="color">

一个基本的例子：

var myobj = {"name":"botskonet","color":"blue"}

for( k in myobj ){
    document.getElementById(k).value = myobj[k];
}

Fiddle

【讨论】：

OP 已经显示 ID 与 json 键不同...不确定此解决方案将如何提供帮助
名字并不重要。您可以使用多种方法来查找正确的字段名称等。无论如何，我不确定有多少示例代码只是为我们简化了。他问“我正在尝试将 json 对象（名称和颜色）的值附加到表单中的两个输入字段。”，我给出了一个非常基本的演示。如果这没有帮助，我很乐意更进一步
+1 这很好用，现在如果我有var myobj = {"name":"botskonet","color":"blue", "animal":"gorilla"} 并且只想显示name 和animal 我得到getElementById 为空。怎么来的？是因为它正在经历一个for循环吗？