Html Chrome中不相关文本区域的数据列表建议

好的，有问题的部门是这个

<table id="torFormContainer">
            <tbody><tr>
                <th colspan="2">
                    New Time Off Request
                </th>
            </tr>
            <tr id="supebox">
                <td>
                    *Supervisor:
                </td>
                <td>
                    <input name="supe" id="supe" type="text" list="supes" required="">
                    <datalist id="supes">
<option value="Ashley Helms">
    </option><option value="Dan Boling">
    </option><option value="Daniel Jenkins">
    </option><option value="Hannah Amos">
    </option><option value="Keith Underwood">
    </option><option value="Shane Smith">
    </option><option value="Wade Horton">
    </option></datalist>

                </td>
            </tr>
            <tr id="sdatebox">
                <td class="left">
                    *Start Date:
                </td>
                <td class="right">
                    <input type="date" id="sdate" name="sdate" min="2014-06-11" onblur="testSdate();" onchange="testSdate();" placeholder="YYYY-MM-DD" required="">
                </td>
            </tr>
            <tr id="edatebox">
                <td class="left">
                    *End Date:
                </td>
                <td class="right">
                    <input id="edate" name="edate" type="date" onblur="testEdate();" onchange="testEdate();" placeholder="YYYY-MM-DD" required="">
                </td>
            </tr>
            <tr id="reasonbox">
                <td class="left">
                    *Reason:
                </td>
                <td class="right">
                    <select id="reason" name="reason" required="">
                        <option value="0" disabled="true">Select a Reason</option>
                        <option value="3">Comp</option>
<option value="6">Death in Family</option>
<option value="4">Family Leave</option>
<option value="5">Personal Leave</option>
<option value="2">Sickness</option>
<option value="1">Vacation</option>

                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    Comment:
                </td>
                <td>
                    <textarea id="comment" placeholder="Optional" rows="5" cols="30"></textarea>
                </td>
            </tr>
            <tr>
                <td class="left" id="required">
                    *Required
                </td>
                <td id="submit">
                    <input id="torSub" type="button" value="Submit" onclick="torPreSubmit();">
                </td>
            </tr>
        </tbody></table>

出于某种原因，据我所知，只有在Chrome中，在完成主管姓名后，文本区域还会显示主管列表中的建议列表。现在，这很可能是我忽略了的一些愚蠢的事情，还有一些jquery对日期等的检查，但我一辈子都无法弄明白这一点。下面是jquery的一些示例

    function torPreSubmit(){    
        var submit = true;
        if($('#sdate').val()===""){
            $('#sdatebox').css('outline','thin solid red');
            console.log("sdate fail");
            submit = false;
        }else{
            console.log("sdate pass");
            $('#sdatebox').css('outline','');
        }
        if($('#edate').val()===""){
            $('#edatebox').css('outline','thin solid red');
            console.log("edate fail");
            submit = false;
        }else{
            console.log("edate pass");
            $('#edatebox').css('outline','');
        }
        if($('#supe').val()===""){
            $('#supebox').css('outline','thin solid red');
            console.log("supe fail");
            submit = false;
        }else{
            console.log("supe pass");
            $('#supebox').css('outline','');
        }
        if($('#reason').val()===null){
            console.log("reason fail");
            $('#reasonbox').css('outline','thin solid red');
            submit = false;
        }else{
            console.log("reason pass");
            $('#reasonbox').css('outline','');
        }
        if(submit){
            torSubmit();
            $('#reasonbox').css('outline','');
            $('#edatebox').css('outline','');
            $('#sdatebox').css('outline','');
        }
    }

function testSdate(){
    $("#edate").val('');
    if(Date.parse($("#sdate").val())<=Date.today()){
        $('#sdate').val('');
    }else{
        $('#edate').attr('min',$("#sdate").val());
    }
}

function testEdate(){
    if((Date.parse($("#edate").val())<Date.today())||(Date.parse($("#edate").val())<Date.parse($("#sdate").val())) ){
        $('#edate').val('');
    }
}

---

建议您检查chrome浏览器的版本，数据列表与浏览器版本35及以下有问题。他们已经在他们的beta版本36中修复了它，您需要从这里下载，这将更新您的浏览器，网站将顺利运行

希望这有帮助

---

干杯。

我也有同样的问题，这似乎是chrome浏览器中的一个bug。我没有数据列表，哈哈