0

有人可以帮我吗？我尝试以多种方式做到这一点，但我做不到。

基本上在我的网页中，我有一个下拉框（国家）和一个自动完成列表（州）。在国家下拉框中，我有两个值（“印度”和“美国”）。状态自动完成列表包含 6 个值（“德里”、“阿萨姆”、“泰米尔纳德邦”、“阿拉巴马”、“阿拉斯加”、“佛罗里达”）。所以这是我的要求，例如，如果用户在国家文本框中选择“印度”，那么只有 印度各州（“德里”、“阿萨姆”、“泰米尔纳德邦”）应该可见或可供他选择在自动完成列表 中，用户不应看到美国各州。 同样，当用户在国家下拉文本框中选择美国时，

只能请一些示例代码帮助我.....

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>demo</title>
        <link rel="stylesheet" href="jquery-ui.css" />
        <script src="jquery-1.9.1.js"></script>
        <script src="jquery-ui.js"></script>

        <script>
          $(function() {
            var collegetypes = [
              "Delhi",
              "Assam",
              "Tamil Nadu",
              "Alabama",
              "Alaska",
              "Florida"
            ];
            $( "#istate" ).autocomplete({
              source: collegetypes
            });
          });
      </script>
    </head>
    <body>
    <?php
        $country = ( !empty( $_REQUEST['COUNTRY'] ) ? $_REQUEST['COUNTRY'] : null );
        $state = ( !empty( $_REQUEST['STATE'] ) ? $_REQUEST['STATE'] : null );

    ?>
        Ajax load<BR>
            <form id="myForm" action='test1.php' method='GET' rel="history">
                Country <BR>
                <select name="COUNTRY"  value="<?=$country;?>">
                <option value="India" <?= ($country === 'India' ? 'selected="selected"' : '')?> >India</option>
                <option value="US" <?= ($country === 'US' ? 'selected="selected"' : '')?> >US</option>
                </select><BR> <BR>
                State <BR>
                <input type="text" name="STATE" id="istate" value="<?=$state;?>"> <BR> <BR>
                <input id="sub" type="submit" value="Search" align="centre"/>
            </form>

            <!--other part of code!-->
    </body> 
</html>
4

1 回答 1

0

试试这个：

HTML

<form id="myForm" action='test1.php' method='GET' rel="history">
    Country <BR>
    <select name="COUNTRY"  id="country" >
    <option value="India" >India</option>
    <option value="US">US</option>
    </select><BR> <BR>
    State <BR>
    <input type="text" name="STATE" id="istate" value=""> <BR> <BR>
    <input id="sub" type="submit" value="Search" align="centre"/>
</form>

JS

$(function() {
    var collegetypesIndia = [
        "Delhi",
        "Assam",
        "Tamil Nadu"
    ];
    var collegetypesUS = [

        "Alabama",
        "Alaska",
        "Florida"
    ];
    $('#country').change(function(){
        if( $('#country').val() == 'India' )
        {
            $( "#istate" ).autocomplete({'source':collegetypesIndia});
        }
        else
        {
            $( "#istate" ).autocomplete({'source':collegetypesUS});
        }
    }); 
    $('#country').change();   
});

看看：http: //jsfiddle.net/GM6Fk/1/

于 2013-08-02T07:34:00.197 回答