从菜单中下拉空选择答案

【问题标题】：Drop-down empty selection from the menu从菜单中下拉空选择
【发布时间】：2017-09-04 06:51:55
【问题描述】：

我使用 JavaScript 应用程序并使用 JSON 列表填充下拉菜单。

                        $("#address").append($('<option></option>').attr("value", "1").text(""));
                        $.each(wallets, function (index, wallet) {

                            if (selectedCurrency === wallet["currency"].toString().trim()) {
                                $("#address").append($('<option></option>').attr("value", "1").text(wallet["address"]));
                            }
                        })

用户界面看起来像这样，

如果我选择空项目（如图所示），我想在控制台中打印empty。否则，我想打印地址值。我的意图是编写更多代码，但是，这是我想开始的地方。我有的代码，

$("#address").change(function () {

        if($(this).val()===""){
            console.log('empty');
        }
        
        else{
            console.log($(this).val());
        }
}

但是，它只在控制台中打印 1，无法区分空栏和相关地址。如果我在change 函数中使用console.log("The value is " + $(this).text());，它会在控制台中一起打印所有信息，

The value is mp51mPC38Wtcmybdyd9MPEB2bKnw6eYbCsmqXjM7Mmg6B5LWMad7mHJi339ddaj7xXdBmvXxP1GmXXKojWQJKjgeoASnXVNXCS47z6n41jE2BKKpV6LsPb7dDdStjtuJf1FrYvMMmw1jtrWU5DADxvNR421MKFW1fposgzVMBymnzcZVF4jtZtGAggM5GuLog3Y5o52Mx4xMmq5Rgggfgy2TiRsvtcGm3rxx12R8XbYi9omkdt7ouyJnDXUp4LzdRSRP3ZhU57gUDKy6n2F2QEKk6Fqqk2yMTope5MYp1RtpT949kemrkdfp6qoVN3YiyJhq6nXPvgr3f7YpkS9j

我拥有的 JSON 数据类似于，

[
  {
    "id": 1,
    "code": "BTC",
    "address": "mp51mPC38Wtcmybdyd9MPEB2bKnw6eYbCs",
    "currency": "Bitcoin"
  },
  {
    "id": 2,
    "code": "BTC",
    "address": "mqXjM7Mmg6B5LWMad7mHJi339ddaj7xXdB",
    "currency": "Bitcoin"
  },
  {
    "id": 4,
    "code": "BTC",
    "address": "mvXxP1GmXXKojWQJKjgeoASnXVNXCS47z6",
    "currency": "Bitcoin"
  }

   // some more data 
]

这里有什么问题？我的猜测是我将数据附加到下拉列表中做错了，需要更改。

如果需要，我可以提供更多信息......

【问题讨论】：

您将值1 设置为空文本$("#address").append($('<option></option>').attr("value", "1").text("")); 将此值更改为空。
.text to .html() // $("#address").append($('').val(wallet.id).html(wallet .address);

标签： javascript jquery json ajax

【解决方案1】：

只需在第一个选项中将值 1 更改为 ""。

$("#address").append($('<option></option>').attr("value", "").text(""));

$.each(wallets, function (index, wallet) {
    if (selectedCurrency === wallet["currency"].toString().trim()) {
          $("#address").append($('<option></option>').attr("value", "1").text(wallet["address"]));
      }
});

检查这个例子。

$("#address").append($('<option></option>').attr("value", "").text(""));
$("#address").append($('<option></option>').attr("value", "1").text("123"));
$("#address").append($('<option></option>').attr("value", "2").text("456"));

 
 $("#address").change(function () {

        if($(this).val()===""){
            console.log('empty');
        }

        else{
            console.log($(this).val());
        }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="address">
</select>

【讨论】：