2

我正在写一些基于选择值动态获取州和城市的东西。例如，如果用户选择“美国”作为国家/地区，则页面通过 AJAX 向服务器发送查询，并填充States“俄亥俄”、“阿拉巴马”、“佛罗里达”等。当用户选择“佛罗里达”时，它将在Cities下拉列表中填充“奥兰多”、“迈阿密”等。

我使用$().change. 当检测到更改时，我使用 . 从选择字段中获取值$().val()。

     País: <select name="country" id="newCompCountry"></select>
 - Estado: <select name="state" id="newCompState"></select>
 - Ciudad: <select name="city" id="newCompCity"></select><br />

选项标签的填充方式如下：

$.get("../process/getCountries.php",  function(data){
        var countries = $("#newCompCountry");
        countries.empty();
        for(var i = 0; i < data.length; i++)
        {
            countries.append("<option value=" + data[i] +">"+ data[i] +"</option>");
        }
    }, "json");

    $.get("../process/getStates.php", {country_name : $("#newCompCountry").val()}, function(data){
        var states = $("#newCompState");
        states.empty();
        for(var i = 0; i < data.length; i++)
        {
            states.append("<option value=" + data[i] +">"+ data[i] +"</option>");
        }
        console.log("ESTADO: " + $("#newCompState").val());
    }, "json");

    $.get("../process/getCities.php", {country_name : $("#newCompCountry").val(), state_name : $("#newCompState").val()}, function(data){
        var cities = $("#newCompCity");
        cities.empty();
        for(var i = 0; i < data.length; i++)
        {
            cities.append("<option value=" + data[i] +">"+ data[i] +"</option>");
        }
    }, "json");

问题是，当我从任何字段中获取 .val() 并且 .val() 恰好有空格时，当检测到空格时，所有内容都会被丢弃。

以我的国家为例。我住在“玻利维亚”，在“拉巴斯”省的“拉巴斯”市。当我抓住“La Paz”的价值时，它就变成了“La”。

这是一个问题，因为数据库包含带有空格的城市名称以及您可能在其他特殊城市中找到的一些其他特殊字符。有没有办法强制 jquery 在检测到空格后不删除任何内容？

这是一个屏幕截图，向您展示我的意思（这是您可以在上面的代码中找到的日志）：

您能给我的任何帮助将不胜感激。

4

1 回答 1

7

查看呈现的 HTML：

<option value=La Paz>La Paz</option>

现在你看到问题了吗？

尝试添加引号。或者，使用vanilla JS：

var states = document.getElementById("newCompState");
states.options.length = 0;
for(var i = 0; i < data.length; i++) {
    states.appendChild(new Option(data[i]));    
}
于 2013-08-26T22:10:06.560 回答