Question

我有一个表格，根据另一个选择框“郊区”的选择，填充选择框“城市”。这适用于我的数据。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

<script>
$(document).ready(function()
{
    $("#suburb").change(function(){
        var suburb = $(this).val();//get select value
        $.ajax({
            url: "get.php",
            type: "post",
            data: { suburb: $(this).val() },
            success: function( responce ){
                $("#city").html( responce );
            }
        });
    });
});
</script>
Suburb:

<select id="suburb">
    <option id="Williamstown">Williamstown</option>
    <option id="Altona">altona</option>
    <option id="Newport">newport</option>
 </select> 
 <select id="city"></select>

我没有使用<select id="suburb">框，而是希望将其作为文本输入 <input type="text" name="suburb">并使用输入文本字段中的值填充城市选择框。

我尝试将其更改为

<script>
$(document).ready(function(){
    $("#suburb").keyup(function(){
        var suburb = $("#suburb").val(); //get select value
        $.ajax({
             url: "get.php",
             type: "post",
             data: { suburb: $("#suburb").val() },
             success: function( responce ){
                  $("#city").html( responce );
             }
        });
    });
});
</script>
Suburb:

 <input type="text" name="suburb">
 <select id="city"></select>

但这不会返回任何东西。我确定我没有正确阅读“郊区”字段中的输入

Answer 1

由于您提供了input名称属性，因此您可以按名称而不是id定位：

$(document).ready(function () {
    $('input[name=suburb]').keyup(function () {
        var suburb = $(this).val(); //get select value
        $.ajax({
            url: "get.php",
            type: "post",
            data: {
                suburb: suburb
            },
            success: function (responce) {
                $("#city").html(responce);
            }
        });
    });
});

Answer 2

试试这个

<script>
$(document).ready(function()
{
$("#suburb").blur(function()
   {
     var suburb = $("#suburb").val();//get select value
     $.ajax(
     {
     url:"get.php",
     type:"post",
     data:{suburb:$("#suburb").val()},
     success:function(responce)
    { $("#city").html(responce);}
    });
    });
  });
</script>
Suburb:

<input type="text" name="suburb">
<select id="city"></select>

Jquery - 从文本字段读取输入

2 个答案: