javascript - 选择列表滚动到特定选项问题

Question

我想做在这个问题中所做的同样的事情:Scroll to a specific div

我已经加载了这些脚本并正在运行:

<script src=\"./js/jquery-1.11.2.min.js\"></script>
<script src=\"./js/jquery-ui.js\"></script>
<script src=\"./js/myscript.js\"></script>

我当前的 PHP/HTML 代码:

echo "<select name=\"travel\" id=\"mySelect\">";
                echo "<option value=\"\" selected=\"selected\"></option>";

                for ( $hours = 0 ; $hours <= 23 ; $hours++ ) {
                    for ( $minutes = 0 ; $minutes <= 45 ; $minutes += 15 ) {

                        echo "<option value=\"$hours:$minutes\">";
                        printf("%02d", $hours);
                        echo ":";
                        printf ("%02d", $minutes);
                        echo "</option>";
                    }
                }
echo "</select>";

我的 JS 在 myscript.js 中:

    $('#mySelect').focus(function(){

    if($(this).data('focused') !==  true)
    {
        $(this).data('focused',true);  
        $(this).children(':last-child').prop('selected',true);
    }

});

$('#mySelect').blur(function(){
   $(this).data('focused',false); 
});

当我打开下拉菜单 23:45 时应该选择它，但它一直显示空白值。

最后，我想将其设置为直接打开下拉菜单，例如 10:00，而不是空白或 00:00，这样用户就不必每次都向下滚动很多次。
没有错误消息，所以我真的不知道我做错了什么。有人可以突出显示我吗？

Answer 1

您无需使用 JavaScript，只需插入银行 <option> 即可获得所需的结果。在列表中的正确位置。

您可以通过检查 $hour 来做到这一点和一个简单的 bool 标志:

echo "<select name=\"travel\" id=\"mySelect\">";
$blankInserted = false;
for ( $hours = 0 ; $hours <= 23 ; $hours++ ) {
    for ( $minutes = 0 ; $minutes <= 45 ; $minutes += 15 ) {
        if($hours==10 && !$blankInserted){
            echo "<option value=\"\" selected=\"selected\"></option>";
            $blankInserted = true;
        }

        echo "<option value=\"$hours:$minutes\">";
        printf("%02d", $hours);
        echo ":";
        printf ("%02d", $minutes);
        echo "</option>";
    }
}
echo "</select>";