Jquery - 设置表单选择字段“选定”值仅在刷新后有效答案

【问题标题】：Jquery - Setting form select-field "selected" value only works after refreshJquery - 设置表单选择字段“选定”值仅在刷新后有效
【发布时间】：2011-01-16 10:27:23
【问题描述】：

我想使用表单选择字段让用户选择他们的居住国家/地区，其中显示基于 IP 的国家作为默认值（加上它旁边的 IP 地址）；

位置信息 (ipinfodb.com) 正在运行。我将“国家”和“IP”传递给函数，它应该修改选择字段和 IP 地址

问题： IP 地址有效，但选择字段仅在我点击刷新后更新。

谁能告诉我为什么？

代码如下：
HTML

<select name="setup_changeCountry" id="setup_changeCountry">
     <option value="AL-Albania">Albanien</option>
     <option value="AD-Andorra">Andorra</option>
     <option value="AM-Armenia">Armenien</option>
     <option value="AU-Australia">Australien</option>
     ...
</select>
<div class="setup_IPInfo">
    <span>Your IP</span>
    <span class="ipAdress"> -- ip --</span>
</div>

Javascript/Jquery

function morph(country,ip) >> passed from function, called on DOMContentLoaded
{
var ipAdress = ip;
$('.ipAdress').text(ipAdress);

var countryForm = country; 
$('#setup_changeCountry  option').each(function()
    {
    if ($(this).val().substr(0,2) == countryForm)
        {
        $(this).attr('selected', "true");
        }
    });
}

感谢您提供有关如何解决此问题的任何线索。

频繁

【问题讨论】：

标签： jquery forms select

【解决方案1】：

您可以极大地简化循环并让 jQuery 完成工作：

$("#setup_changeCountry option[value$='" + country + "']").attr('selected', true);

确保：

大小写匹配（您的国家/地区也必须以大写字母开头）
您在 DOM 加载后执行此代码，否则您可能会尝试选择尚不存在的选项

【讨论】：

我使用了each()，因为我首先需要“substr”选项值（AL-Albania > AL）。您的代码会简单得多，但是我必须编辑所有选项以仅显示两个字母 (AL)。无论如何感谢您的信息。
@frequent，要么我不理解你，要么你错了。 [value^=''] 查看字符串的第一部分，[value$=''] 查看字符串的最后一部分。它自己执行 substr！
帮助很大。谢谢！我需要检查前 2 个字母，所以它应该是 [value^="]。仍然没有帮助该字段仅在重新加载页面后更新。
确保您在 $(document).ready() 上调用该函数，如果这不起作用，请确保您的 javascript 变量在预期时间的位置。例如，尝试将它们记录到控制台
知道了...在所有信息（IP、国家/地区）可用和存储之前调用了该函数。并且我在 Jquery-Mobile 中完成了所有操作，这意味着（现在）正确设置的选择字段被隐藏，并且显示的替换按钮仍然显示第一个选项。也设法纠正了这一点，所以我是一个快乐的露营者。感谢您的意见！

【解决方案2】：

它是 selected="selected" 而不是 selected="true"，因此：

$(this).attr('selected', 'selected');

（你也可以跳过var ipAdress，直接在下一行传递ip）

【讨论】：

selected 是一个布尔值，而不是一个属性=值对，所以它是正确的$(this).attr('selected',true); / $(this).removeAttr('selected');。
是的，确实如此（而且比我的版本更正确）。我只是对 (string, string) 类型发表评论。感谢您指出了这一点。拥有 selected="selected" 语法是 XHTML 中 XML 文档派生（有限）语法的结果。
我花了一段时间才弄清楚它实际上也是“真实的”:-)

【解决方案3】：

你应该使用：

 $(document).ready(name_of_function);

这样您就可以运行函数来选择国家。您可以使用此功能：

function morph(country,ip){
    var ipAdress = ip;
    $('.ipAdress').text(ipAdress);
    var countryForm = country; 
    $("#setup_changeCountry option[value$='" + country + "']").attr('selected', true);
}

【讨论】：