Question

来自https://www.gov.sg/resources/translation的网址来源：

<div id="content_0_UPnlTranslate">
<div onkeypress="javascript:return WebForm_FireDefaultButton(event, 'BtnTranslateSearch')">
<div class="control">

<input type="hidden" name="content_0$IsDetectField" id="IsDetectField">

<span class="from-wrap">
    <label for="content_0_DdlFrom">From</label>
        <select name="content_0$DdlFrom" onchange="javascript:setTimeout('__doPostBack(\'content_0$DdlFrom\',\'\')', 0)" id="content_0_DdlFrom" class="control-select from" style="display: none;">
            <option selected="selected" value="1">English</option>
            <option value="2">Chinese</option>
            <option value="3">Malay</option>
            <option value="4">Tamil</option>
        </select>

    <div class="btn-group bootstrap-select control-select from"><button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="content_0_DdlFrom" title="English"><span class="filter-option pull-left">English</span>&nbsp;<span class="caret"></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner selectpicker" role="menu"><li data-original-index="0" class="selected"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>English</span>"><span class="text">English</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Chinese</span>"><span class="text">Chinese</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Malay</span>"><span class="text">Malay</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Tamil</span>"><span class="text">Tamil</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div>
</span>

<input type="submit" name="content_0$BtnSwitch" value="Switch" id="content_0_BtnSwitch">

<span class="to-wrap">
    <label for="content_0_DdlTo">To</label>
        <select name="content_0$DdlTo" id="content_0_DdlTo" class="control-select to" style="display: none;">
        <option selected="selected" value="2">Chinese</option>
        <option value="3">Malay</option>
        <option value="4">Tamil</option>

        </select>

    <div class="btn-group bootstrap-select control-select to"><button type="button" class="btn dropdown-toggle selectpicker btn-default" data-toggle="dropdown" data-id="content_0_DdlTo" title="Chinese"><span class="filter-option pull-left">Chinese</span>&nbsp;<span class="caret"></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner selectpicker" role="menu"><li data-original-index="0" class="selected"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Chinese</span>"><span class="text">Chinese</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="1"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Malay</span>"><span class="text">Malay</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" data-normalized-text="<span class=&quot;text&quot;>Tamil</span>"><span class="text">Tamil</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div>
</span>

</div></div></div>

有content_0$DdlFrom内容_0 $ DdlTo , with values ranging [1,2,3,4]可选项目。

使用指定的值访问选择的项目时，似乎仅在content_0$DdlFrom='1'和content_0$DdlTo='2'中使用：

from itertools import combinations

from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.support.ui import Select

import pyderman

options = Options()
options.headless = True
driver = webdriver.Chrome(path, chrome_options=options) 


for f, t in combinations([1,2,3,4], 2):
    from_lang = Select(driver.find_element_by_name("content_0$DdlFrom"))
    to_lang = Select(driver.find_element_by_name("content_0$DdlTo"))
    from_lang.select_by_value(str(f))
    to_lang.select_by_value(str(t))

除content_0$DdlFrom='1'和content_0$DdlTo='2'以外的另一个值引发ElementNotInteractableException：

---------------------------------------------------------------------------
ElementNotInteractableException           Traceback (most recent call last)
<ipython-input-87-de5d373a948a> in <module>
      4     to_lang = Select(driver.find_element_by_name("content_0$DdlTo"))
      5     from_lang.select_by_value(str(f))
----> 6     to_lang.select_by_value(str(t))

ElementNotInteractableException: Message: element not interactable: Element is not currently visible and may not be manipulated
  (Session info: chrome=77.0.3865.120)

问题是，是因为name="content_0$IsDetectField"吗？如果不是，是什么原因导致ElementNotInteractableException？

然后如何解决问题并正确选择content_0$DdlFrom和content_0$DdlTo分别具有1和2以外的值？

Answer 1

注意事项：

从中选择英语时，可以从列表中将其翻译为其他3种语言。
当您选择英语以外的语言时，则只能从to列表中选择英语。

我列出了两个列表，您可以根据需要更改相应的语言。

您可以使用以下代码：

driver = webdriver.Chrome(executable_path = r'C:/Users/user****/Downloads/BrowserDriver/chromedriver_win32/chromedriver.exe')
wait = WebDriverWait(driver,10)

driver.maximize_window()

driver.get("https://www.gov.sg/resources/translation")

wait.until(EC.element_to_be_clickable((By.XPATH, "//label[text()='From']/following-sibling::div/button"))).click()

from_list = driver.find_elements_by_xpath("//label[text()='From']/following-sibling::div/descendant::a/span[@class='text']")

for pick in from_list:
 if pick.text =='Malay':
   pick.click()

wait.until(EC.element_to_be_clickable((By.XPATH, "//label[text()='To']/following-sibling::div/button"))).click()

to_list = driver.find_elements_by_xpath("//label[text()='To']/following-sibling::div/descendant::a/span[@class='text']")

for drop in to_list:
 if drop.text =='Tamil':
   pick.click()

Answer 2

您错过了select有一个style="display: none;"的情况因此，元素不可交互，并且引发了错误。

您必须触发下拉菜单，以便它可以交互。

例如：键入，单击还是其他方式，取决于网站的实现。

当选择项上存在选项的值时，为什么元素不是不可交互的？

2 个答案: