$(this).val() 方法没有返回所选 id 的正确值

Question

我正处于学习 Django 与 AJAX 啮合的初级阶段，并且非常接近完成我的应用程序，这只是一个包含国家和城市的简单依赖下拉列表。不过，我遇到了一些令人头疼的问题。我试图从我的 'select_countries' 选择器中获取的数值不是返回数值，而是实际国家本身，这阻止了我的 AJAX 调用正常工作，因为它需要一个整数。 我通过国家的数字 ID 而不是名称从我的数据库中提取与每个国家/地区相关联的城市，所以这显然给我带来了问题。

我将 1 的 id（代表英格兰）硬编码到 countryId 变量中，并验证我的 AJAX 调用确实有效，并返回了它应该在 'select_cities' 选择器，在单独的 html 模板中处理。我只需要解决如下图所示的小问题。

我在 SO 上进行了一些搜索，发现有些人通过将 .val() 更改为 .data("value") 设法解决了类似问题 和 .attr("value") 像这样。

 var countryId = $(this).attr("value")

 or

 var countryId = $(this).data("value")

不幸的是，这一切只是在 countryId 中存储一个 undefined 值。这允许 ajax 调用正确执行，但它不会返回“select_cities”选择器中的任何选项。

如您所见，var CountryId 应该存储 2，而不是 Ireland。 任何人都知道问题可能是什么？

Answer 1

val 在此处不是有效属性：

<option val="1">England</option>

属性名称应为value。由于没有value，因此默认为元素的内容，在本例中为'England'。

要从.val() 获取值，它必须是有效的value 属性：

<option value="1">England</option>

Answer 2

你想要这样的东西吗？

$("#selectcountries").change(() => {
    var selectedCountry = $(this).attr('val');
    alert("You have selected the country - " + selectedCountry);
});