想要在选择选项中附加 Ajax 响应数据答案

【问题标题】：Want to apend Ajax response data in select option想要在选择选项中附加 Ajax 响应数据
【发布时间】：2020-02-29 16:00:22
【问题描述】：

想要追加选择选项，但不知道如何在选择选项中获取响应值。

在响应中获取的所有值但不能附加在选择选项中，我认为语法错误

success: function (response) {

   if (response) {
        console.log(response);
        $("#state").empty();
        $("#state").append('<option value="" selected disabled>Select State</option>');
        $.each(response, function (id, name) {
              $("#state").append('<option value="' + id + '">' + name + ' </option>');

        });
    }
}

控制台输出：已获取但无法附加到选择选项中的值

[{…}]
  0: {id: 4, name: "Valencia"}
  1: {id: 5, name: "ABC"}
     length: 2
     __proto__: Array(0)

【问题讨论】：

你能添加你的标记吗？

标签： javascript html ajax laravel

【解决方案1】：

您没有以索引方式提取值。你有一个包含两个 json 对象的数组。所以你需要使用下面的索引来提取。

success: function (response) {

   if (response) {
        console.log(response);
        $("#state").empty();
        $("#state").append('<option value="" selected disabled>Select           State</option>');
        $.each(response, function (index, value) {
              $("#state").append('<option value="' + response[index].id + '">' + response[index].name + ' </option>');

        });
    }

【讨论】：

【解决方案2】：

success: function (response) {

   if (response) {
        console.log(response);
        $("#state").empty();
        $("#state").append('<option value="" selected disabled>Select State</option>');
        $.each(response, function (index, value) {
              $("#state").append('<option value="' + value.id + '">' + response[index].name + ' </option>');

        });
    }

各功能实现错误，见文档：https://api.jquery.com/jQuery.each/

第一个参数是索引，可选，第二个是循环中的当前对象。

我改变了你的代码来展示如何使用每一个

编辑：错过了一个“。”

【讨论】：

您的代码不起作用..您必须使用response[index].name。为什么不改用value.name？
@Wolfetto 你说得对，谢谢，错过了那个点。我也会使用 value.name 来代替，但是我只是说明了如何将索引用作示例

【解决方案3】：

.each应用到一个对象上按手动返回：

jQuery.each( object, callback )

地点：

object
Type: Object
The object to iterate over.

callback
Type: Function( String propertyName, Object valueOfProperty )
The function that will be executed on every value.

所以在name 里面你有一个对象。根据此获取name 属性，您必须使用name.name。

所以，你可以使用更好的变量名：

$.each(response, function (id, element) {
          $("#state").append('<option value="' + element.id + '">' + element.name + ' </option>');

【讨论】：