如何选择< option>项目由“值” < select>中的属性下拉列表？ [英] How to select <option> item by the "value" attribute in <select> drop-down list?
问题描述
在我的Delphi应用程序中，我正在使用一个 TWebBrowser 控件，其中我加载了一个HTML文档，其中包含一个< select> 元素（下拉列表）与几个< option> 项目（下拉列表项）。假设我的Web浏览器中加载了以下HTML文件：
In my Delphi application I'm using a TWebBrowser control, where I have loaded an HTML document, containing a <select> element (drop down list) with a few <option> items (drop down list items). Let's say, I have the following HTML document loaded in my web browser:
<html>
<body>
<select id="ComboBox">
<option value="firstvalue">First Value</option>
<option value="secondvalue">Second Value</option>
<option value="thirdvalue">Third Value</option>
</select>
</body>
</html>
如何以编程方式选择例如 的< option> 属性第三个值 ？或者换句话说，当我只知道这个项目的值属性是 thirdvalue 时，如何以编程方式选择此下拉列表中的第三个项目/ code>？
How can I programatically select e.g. the <option>, whose value attribute is thirdvalue ? Or in other words, how can I programatically select the third item in this drop down list, when I know only that this item's value attribute is thirdvalue ?
推荐答案
您可以使用 IHTMLSelectElement 与其 selectedIndex 属性。作为展示我做了以下功能。
You can use the IHTMLSelectElement interface with its selectedIndex property for instance. As a showcase I've made the following function.
以下函数尝试查找，并选择（如果找到）给定的值属性值的< option> （下拉列表项）在指定的< select> 元素（下拉列表）中。如果没有找到< option> ，则清除当前下拉列表选择（没有选择项）。
The following function tries to find, and select (if found) an <option> (a drop down list item) of a given value attribute value in a specified <select> element (drop down list). If no <option> is found, the current drop down list selection is cleared (no item is selected).
参数：
Parameters:
- ADocument - 输入HTML文档的界面
- AElementID -
< select>元素的ID（下拉列表的元素ID） - AOptionValue - 搜索
< option>元素值（下拉列表项的值）
- ADocument - the interface to an input HTML document
- AElementID - ID of a
<select>element (element ID of a drop down list) - AOptionValue - searched
<option>element value (value of a drop down list item)
返回值：
Return value:
如果< option> ; 与给定的值成功找到（并选择），返回值是指定下拉列表中该选项的索引，
If the <option> with a given value is successfully found (and selected), the return value is the index of that option in a specified drop down list, -1 otherwise.
源代码
Source code:
function SelectOptionByValue(const ADocument: IDispatch; const AElementID,
AOptionValue: WideString): Integer;
var
HTMLDocument: IHTMLDocument3;
HTMLElement: IHTMLSelectElement;
function IndexOfValue(const AHTMLElement: IHTMLSelectElement;
const AValue: WideString): Integer;
var
I: Integer;
begin
Result := -1;
for I := 0 to AHTMLElement.length - 1 do
if (AHTMLElement.item(I, I) as IHTMLOptionElement).value = AValue then
begin
Result := I;
Break;
end;
end;
begin
Result := -1;
if Supports(ADocument, IID_IHTMLDocument3, HTMLDocument) then
begin
if Supports(HTMLDocument.getElementById(AElementID), IID_IHTMLSelectElement,
HTMLElement) then
begin
Result := IndexOfValue(HTMLElement, AOptionValue);
HTMLElement.selectedIndex := Result;
end;
end;
end;
使用示例
Example usage:
从HTML文档的下拉列表中选择具有 thirdvalue 值的项目，可以使用此代码（假设在 WebBrowser1 组件此处加载该文档）：
To select the item with thirdvalue value in drop down list from the HTML document from the question it's possible to use this code (assuming in the WebBrowser1 component here is loaded that document):
procedure TForm1.Button1Click(Sender: TObject);
var
Index: Integer;
begin
Index := SelectOptionByValue(WebBrowser1.Document, 'ComboBox', 'thirdvalue');
if Index <> -1 then
ShowMessage('Option was found and selected on index: ' + IntToStr(Index))
else
ShowMessage('Option was not found or the function failed (probably due to ' +
'invalid input document)!');
end;
问题示例HTML文档：
Example HTML document from the question:
<html>
<body>
<select id="ComboBox">
<option value="firstvalue">First Value</option>
<option value="secondvalue">Second Value</option>
<option value="thirdvalue">Third Value</option>
</select>
</body>
</html>
这篇关于如何选择< option>项目由“值” < select>中的属性下拉列表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
