应该更改哪些属性以允许通过Selenium上载图像

Question

设置

我使用Python+Selenium将图像上载到系统的后端。在

Isend_keys()的上载按钮具有以下HTML

<div id="uploadifive-FileNameUpload" class="uploadifive-button" style="height:
18px; line-height: 18px; overflow: hidden; position: relative; text-align: center;
width: 50px;">
  Upload
  <input id="FileNameUpload" name="FileNameUpload" data-editor="#FileName" 
  data-url="http://also-inc.com/upload/uploadfile" data-path="~/UserFiles/Products/Images/" 
  data-maxsize="10240" data-extensions="*.jpg;*.jpeg;*.png;*.gif;*.bmp;" 
  data-thumbnailwidth="128" data-thumbnailheight="128" 
  data-thumbnailpath="/UserFiles/Products/Images/Preview/" data-uniquename="True" 
  data-preview="/Content/uploadify/noimage.jpg" data-isnew="true" 
  data-auth="D2C14774E29BBB87D2F34719884CFC5C6370502B067D5FC55D0C40A5EE6B1646ED4C77C9C0180D607052FF52653BA981732417A24C3F7547903649C4D64491C184E1C60D7756608784B4B3E806417E77750D87BABD9CDDCB6294EA62DE884EC7B3A4416558405874ED1C0259CD4430990BA83FC0" 
  data-session="f1txsiyxglqb3ma1dr45awrf" class="file-uploader hide-input" style="display: none;" 
  type="file">
  <input style="font-size: 18px; opacity: 0; position: absolute; right: -3px; top: -3px; z-index: 999;" type="file">
</div>

注意，按钮有两个input和type="file"。在

---

使用的代码

^{pr2}$

其中el_id() = browser.find_element_by_id()和{}以.jpeg结尾。在

---

问题

使用的代码通过第二个input成功上载图像。但是，保存图像时不使用.jpeg扩展名。因此，图像在后端显示为损坏；即image_name而不是image_name.jpeg。在

我认为保存图像时没有扩展名，因为第二个input不允许它。在

---

尝试

1. 将属性添加到第二个input

第一个input具有以下属性data-extensions="*.jpg;*.jpeg;*.png;*.gif;*.bmp;"。我将这个属性添加到第二个input

upload_button = el_id('uploadifive-FileNameUpload').find_element_by_xpath('input[2]')
browser.execute_script("arguments[0].setAttribute('data-extensions','*.jpg;*.jpeg;*.png;*.gif;*.bmp;')", upload_button)
upload_button = el_id('uploadifive-FileNameUpload').find_element_by_xpath('input[2]')
upload_button.send_keys(path_to_my_image)  

这增加了属性，但是上传的图像仍然保存在没有.jpeg扩展名的情况下。在

1. 更改第一个class和style属性

第一个input有class="file-uploader hide-input"和{}，我通过设置为class="file-uploader"和{}

upload_button = el_id('uploadifive-FileNameUpload').find_element_by_xpath('input[1]')
browser.execute_script("arguments[0].setAttribute('class','file-uploader hide-input')", upload_button)
upload_button = el_id('uploadifive-FileNameUpload').find_element_by_xpath('input[1]')
browser.execute_script("arguments[0].setAttribute('style','display: block')", upload_button)
upload_button = el_id('uploadifive-FileNameUpload').find_element_by_xpath('input[1]')
upload_button.send_keys(path_to_my_image)  

但是图像不会上传。上载按钮变为本机操作系统文件选择器“选择文件”按钮。在

我怎么解决这个问题？在

---

侧注

我不明白为什么这个按钮有两个input。我是个初学者，所以如果我错了请原谅我，但是直觉上我认为一个按钮只需要1input？在

Answer 1

根据您的代码尝试，我们似乎无法对第二个<input>标记做太多操作。但是您可以简单地从第一个<input>标记中删除属性style=“display:none；”“，然后尝试调用send_keys()方法，如下所示：

element = driver.find_element_by_xpath("//input[@id='FileNameUpload' and @name='FileNameUpload']")
driver.execute_script("arguments[0].removeAttribute('style')", element)
driver.find_element_by_xpath("//input[@id='FileNameUpload' and @name='FileNameUpload']").send_keys("path_to_my_image")

注意：指向图像的路径必须是以.jpg、.jpeg、.png、.gif或.bmp扩展名的图像文件的绝对路径，并且必须小于10240个字节。在

Answer 2

在<input>标记中，文本位于value属性中。用JavaScript设置它应该可以

upload_button = el_id('FileNameUpload')
browser.execute_script("arguments[0].value = 'arguments[1]';", upload_button, path_to_my_image)