如何处理使用selenium python时出现的滤镜框？

Question

我使用selenium python访问chrome中的web page。在转到一个页面后，我点击了一个名为“搜索”的项目。当我单击它时，将出现如下所示的filterbox

​

​

点击restrict by date，在from和to框中填充值，然后使用selenium python提交，我应该怎么做？对不起，我是新来的selenium，我找不到任何例子，以满足我的requirements.This过滤器框没有与它相关的网址。

下面是我找到的后端源代码：

<div class="hd" id="alert_search_dialog_h" style="cursor: move;">
                    Search Criteria
                </div>

<form action="/portal/alerts" id="alert_search_form" method="get" onsubmit="new Ajax.Request('/portal/alerts', {asynchronous:true, evalScripts:true, parameters:Form.serialize(this)}); return false;">            <input id="search_startTimeXml" name="search[startTimeXml]" type="hidden">
            <input id="search_endTimeXml" name="search[endTimeXml]" type="hidden">
            <input id="search_limit" name="search[limit]" type="hidden" value="50">
            <input id="search_offset" name="search[offset]" type="hidden" value="0">

    <fieldset><legend><input class="restrict_checkboxes" id="include_id" name="include_id" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;id_field&quot;);" type="checkbox" value="1">Restrict by ID</legend>
        <div id="id_field" class="disabled">
            <label for="alert_id">Alarm ID</label>
            <input id="search_alert_id" name="search[alert_id]" type="text" disabled="">
        </div>
    </fieldset>
    <fieldset><legend><input class="restrict_dropdown" id="include_route" name="include_route" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;type_drop_down_list&quot;);" type="checkbox" value="1">Restrict by route</legend>

         <input id="search_route_min_distance" name="search[route_min_distance]" type="hidden">
         <input id="search_route_max_distance" name="search[route_max_distance]" type="hidden">
         <input id="search_route_min_velocity" name="search[route_min_velocity]" type="hidden">
         <input id="search_route_max_velocity" name="search[route_max_velocity]" type="hidden">
        <div id="type_drop_down_list" class="dropdown_list disabled">
            <table>
                <tbody><tr>
                    <th>Route ID</th>
                    <td>

                        <select id="search_route_id" name="search[route_id]" onchange="change_route_directions(this.value)"><option value="">--All--</option>
</select>
                    </td>
                </tr>
                <tr>
                    <th>Route direction</th>
                    <td>


                        <select id="search_route_direction" name="search[route_direction]"><option value="">--All--</option>
</select>
                    </td>
                </tr>
                <tr>
                    <th>Distance(<span>m</span>)</th>
                    <td>
                        min
                        <input id="search_route_min_distance_" name="search[route_min_distance_]" size="8" type="text" disabled="">
                        max
                        <input id="search_route_max_distance_" name="search[route_max_distance_]" size="8" type="text" disabled="">
                    </td>
                </tr>
                <tr>
                    <th>
                        Velocity (m/s):
                    </th>
                    <td>
                        min
                        <input id="search_route_min_velocity_" name="search[route_min_velocity_]" size="8" type="text" disabled="">
                        max
                        <input id="search_route_max_velocity_" name="search[route_max_velocity_]" size="8" type="text" disabled="">
                    </td>
                </tr>

            </tbody></table>
        </div>
    </fieldset>
    <fieldset><legend><input class="restrict_checkboxes" id="include_type" name="include_type" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;type_check_box_list&quot;);" type="checkbox" value="1">Restrict by alarm type</legend>
        <div id="type_check_box_list" class="checkbox_list disabled" style="max-height:100px;-webkit-columns: 100px 2;">

                <input id="search_name_" name="search[name][]" type="checkbox" value="digging_alert" disabled="">
                Digging<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="fibre_break_alert" disabled="">
                Fibre Break<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="helios" disabled="">
                Helios Unit Failure<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="mech_digging_alert" disabled="">
                Mechanized Digging<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="panoptes" disabled="">
                Panoptes Failure<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="unknown_alert" disabled="">
                Unknown<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="vehicle_alert" disabled="">
                Vehicle<br>

                <input id="search_name_" name="search[name][]" type="checkbox" value="walk_alert" disabled="">
                Walking<br>

        </div>
    </fieldset>
    <fieldset><legend><input class="restrict_checkboxes" id="include_threat" name="include_threat" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;threat_check_box_list&quot;);" type="checkbox" value="1">Restrict by threat level</legend>
    <div id="threat_check_box_list" class="checkbox_list disabled" style="-webkit-columns: 100px 2;">

                <input id="search_threat_level_" name="search[threat_level][]" type="checkbox" value="red" disabled="">
                Red<br>

                <input id="search_threat_level_" name="search[threat_level][]" type="checkbox" value="amber" disabled="">
                Amber<br>

                <input id="search_threat_level_" name="search[threat_level][]" type="checkbox" value="green" disabled="">
                Green<br>

                <input id="search_threat_level_" name="search[threat_level][]" type="checkbox" value="clear" disabled="">
                Clear<br>

    </div>
    </fieldset>
    <fieldset><legend><input class="restrict_checkboxes" id="include_status" name="include_status" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;status_check_box_list&quot;);" type="checkbox" value="1">Restrict by alarm status</legend>
        <div id="status_check_box_list" class="checkbox_list disabled" style="-webkit-columns: 100px 3;">

                <input id="search_status_" name="search[status][]" type="checkbox" value="acknowledged" disabled="">
                Acknowledged<br>

                <input id="search_status_" name="search[status][]" type="checkbox" value="new" disabled="">
                New<br>

                <input id="search_status_" name="search[status][]" type="checkbox" value="resolved" disabled="">
                Resolved<br>

        </div>
    </fieldset>
    <fieldset><legend><input class="restrict_checkboxes" id="include_date" name="include_date" onclick="javascript: admin.alerts.SearchDialog.disableByCheckbox(this, &quot;date_table&quot;);" type="checkbox" value="1">Restrict by date</legend>

        <table id="date_table" class="disabled">
            <tbody><tr>
                <td><label for="start_time">From</label></td>
                <td>            <input type="text" name="start_time" id="start_timeId" size="12" value="" disabled="">
                <img alt="Img" id="start_timeImg" onmouseout="this.style.background='';" onmouseover="this.style.background='red';" src="/javascripts/fotech/common_gui/jscalendar/img.gif?1570706592" style="cursor: pointer;" title="Select min date/time">
            <script type="text/javascript">
                _fotechSetupCalendar('start_time',{}); 
            </script>
</td>
                <td><label for="end_time">To</label></td>
                <td>            <input type="text" name="end_time" id="end_timeId" size="12" value="" disabled="">
                <img alt="Img" id="end_timeImg" onmouseout="this.style.background='';" onmouseover="this.style.background='red';" src="/javascripts/fotech/common_gui/jscalendar/img.gif?1570706592" style="cursor: pointer;" title="Select max date/time">
            <script type="text/javascript">
                _fotechSetupCalendar('end_time',{}); 
            </script>
</td>
            </tr>
        </tbody></table>
    </fieldset>

    <table>
        <tbody><tr>
            <th><label for="search_order_by">Order by</label></th>
            <td>
                <select id="search_order_by" name="search[order_by]"><option value="time">Time</option>
<option value="name">Alarm type</option>
<option value="status">Status</option></select>
                <select id="search_order_dir" name="search[order_dir]"><option value="asc">Ascending</option>
<option value="desc">Descending</option></select>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input id="search_include_suppressed" name="search[include_suppressed]" type="checkbox" value="1">
                <label for="search_include_suppressed">Include suppressed</label>
            </td>
        </tr>
    </tbody></table>
</form>

Answer 1

您需要做的是首先使用Chrome来理解站点结构，了解您想要单击什么以及如何单击，然后才能编写将与selenium一起运行的代码。

Chrome DevTools是一组直接内置到Google Chrome中的web开发工具

如果要使用DOM或CSS，请右键单击页面上的某个元素，然后选择Inspect以跳转到Elements面板。或者按Command+Option+C (Mac)或Control+Shift+C (Windows、Linux、Chrome OS)。

Chrome DevTools