Question

我正在构建一个自定义蜡烛的图形表示。

现在，我们的想法是客户按顺序从下拉框中选择香水。当他们填写一个下拉框时，下一个出现，最多五个。我的麻烦在于我无法找到最有效率的方法。

    <div class="mainbody">
<div>
<span class="subtitle">Build Candles</span>
</div>
<div class="candle">
    <div class="candle_top">
    </div>
    <div class="candle_fifth">
    FIFTH
    </div>
    <div class="candle_fourth">
    FOURTH
    </div>
    <div class="candle_third">
    THIRD
    </div>
    <div class="candle_second">
    SECOND
    </div>
    <div class="candle_first">
    FIRST
    </div>
    <div class="candle_bottom">
    </div>

</div>
<div class="design">
<?php
$db_server="localhost";
$db_username="root";
$db_pword="";
$db_database="candles";

mysql_connect($db_server, $db_username, $db_pword);
if (strlen(mysql_error())>0) 
    {$PSUBMIT=5;
    $SQL['error']=mysql_error();
    $db_server="* Invalid * ";
    }
else mysql_select_db($db_database);
?>
<form method="get">
First:  <select name="first">
        <option></option>
        <?php
            $query = mysql_query("SELECT * FROM products");
            while($row = mysql_fetch_array($query)){
                echo '<option>'.$row[1].'</option>';
            }
        ?>
        </select><br />

Second: <select name="second">
        <option></option>
        <?php
            $query = mysql_query("SELECT * FROM products");
            while($row = mysql_fetch_array($query)){
                echo '<option>'.$row[1].'</option>';
            }
        ?>
        </select><br />

Third: <select name="third">
        <option></option>
        <?php
            $query = mysql_query("SELECT * FROM products");
            while($row = mysql_fetch_array($query)){
                echo '<option>'.$row[1].'</option>';
            }
        ?>
        </select><br />

Fourth: <select name="fourth">
        <option></option>
        <?php
            $query = mysql_query("SELECT * FROM products");
            while($row = mysql_fetch_array($query)){
                echo '<option>'.$row[1].'</option>';
            }
        ?>
        </select><br />

Fifth: <select name="fifth">
        <option></option>
        <?php
            $query = mysql_query("SELECT * FROM products");
            while($row = mysql_fetch_array($query)){
                echo '<option>'.$row[1].'</option>';
            }
        ?>
        </select><br />

        <input type="submit" value="Preview" name="submit" />
</form>
</div>
</div>

我在想jQuery追加，但我不知道如何检查是否填充了First。然后，如果填充第一个和第二个以允许附加第三个。

Answer 1

$('select').change(function(){
    if($(this).val()!='') $(this).next('select:first').show();
}

Answer 2

http://jsfiddle.net/isherwood/XMx4Q

$('select').change(function () {
    $(this).next('select').fadeIn();
});

如果先填写另一个下拉框，我该如何制作新的下拉框？

2 个答案: