How to push the button in the web page like this?

Question

I am using Delphi XE2 + TWebbrowser,the web page source code like below:

<html>
<head>
<title>
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var loaded = 0;function ScriptLoaded() { ++loaded; if(loaded == 2) ARSystemInit(); }
var ReportSelForm="ReportSelection", RelContextPath='../../../../',AbsContextPath=null;</script>
<link rel="stylesheet" href="../../../../resources/stylesheets/7.1.00 Patch 009 201002230034/ARSystem.css">
<link rel="stylesheet" href="../../../../resources/stylesheets/7.1.00 Patch 009 201002230034/ARSystem_zh.css">
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/LocalizedMessages_zh_CN.js" defer></script>
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/locale/zh_CN.js" defer></script>
<script type="text/javascript">function DVFsf(){return "\x3cHTML\x3e\x3c/HTML\x3e";} function DVFol(){}</script>
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/ClientCore.js" defer></script>
<script type="text/javascript" src="form.js/f7a68ba8.js" defer></script>
<script type="text/javascript">document.write('\x3cscript src="userdata.js?winname=ar05UltraProcess%3AITIL_Incident'+encodeURIComponent(name)+'" defer\x3e\x3c/'+'script\x3e');</script>
</head>
<body onload="ScriptLoaded&#40;&#41;" draghandler="BodyDrag" style="display:none">
<div id="Toolbar"><div class="TBTopBarStatus">当前模式： <span class="TBTopBarStatusMode"></span></div><a class="btn TBTopBarBox" href="javascript:"><img class="tbright" src="../../../../resources/images/tb_right.gif" alt="显示工具栏" /><img class="tbdown" src="../../../../resources/images/tb_down.gif" alt="隐藏工具栏" /></a><table cellpadding=0 cellspacing=0 class="Toolbar"><tbody><tr><td nowrap class="TBGroup TBGroup0">
<a class="searchsavechanges btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsearchsavechanges">搜索</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup1">
<a class="newsearch btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBnewsearch"><img src="../../../../resources/images/tb_search.gif" alt="新搜索" /> 新搜索</div>
</a>
<a class="newrequest btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBnewrequest"><img src="../../../../resources/images/tb_request.gif" alt="新请求" /> 新请求</div>
</a>
<a class="modifyall btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBmodifyall"><img src="../../../../resources/images/tb_modall.gif" alt="全部修改" /> 全部修改</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup2">
<a class="savedsearches btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsavedsearches"> 多项搜索</div>
</a>
<a class="advancedsearch btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBadvancedsearch">高级搜索</div>
</a>
<a class="clear btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBclear">清除</div>
</a>
<a class="settodefaults btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsettodefaults">设置为默认值</div>
</a>
<a class="statushistory btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBstatushistory">状态历史记录</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup3">
<a class="logout btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBlogout">注销</div>
</a>
<a class="help btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBhelp">帮助</div>
</a>
<a class="home btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBhome">主页</div>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<div id="ResultsList">
<div arid=1020 artype="Table" ardbn="CustomResultsList" class="arfid1020 ardbnCustomResultsList" style="top:0&#59; left:0&#59; width:0&#59; height:0&#59;visibility:hidden&#59;z-index:0&#59;" arcols="2147483647" arcolws="1575" arcoldlen="254" ardrill=1 arserver="@" arschema="@" armaxrows=0 ardtype=1 arcsize=0 arfixhdr=1 arselrows=0 arselinit=0 arselrefresh=0 arautofit=0 arsort="" arqual="{qual:&quot;&quot;, ids:[],extids:[]}"><img src="../../../../resources/images/menu_down.gif" alt="" class="TableSortImgUp" arindom=1 /><img src="../../../../resources/images/menu_up.gif" alt="" class="TableSortImgDown" arindom=1 /><div class='TableHdr'><table class='TableHdr' cellpadding=0 cellspacing=0><tbody><tr><td nowrap valign=middle class='TableHdrL'></td><td nowrap valign=middle class='TableHdrR'></td></tr></tbody></table></div><div class='TableInner'></div><div class='TableFtr'><table class='TableFtr' cellpadding=0 cellspacing=0><tbody><tr><td nowrap valign=middle class='TableFtrL'></td><td nowrap valign=middle class='TableFtrR'></td></tr></tbody></table></div></div>
</div>
<div id="Splitter" draggable=1 dragoriginal=1>
</div>
<div id="FormContainer" arcs=1 style="background-color:">
<div style="top:0&#59;left:0&#59;width:1173&#59;height:869">&nbsp;</div>
<div arid=700000002 artype="Char" ardbn="BaseName" class="df  dfro arfid700000002 ardbnBaseName" style="z-index:994&#59;top:2&#59; left:9&#59; width:100&#59; height:25&#59;">
<span style="top:0&#59; left:0&#59; width:100&#59; height:0&#59;"><label class="label f9" for="x-arid700000002" style="width:100px&#59;left:0px&#59;bottom:25px&#59;color:&#59;text-align:center&#59;"></label></span><textarea class="text sr f2 dat" wrap="off" id="arid700000002" cols="20" maxlen=254 style="top:0&#59; left:0&#59; width:100&#59; height:25&#59;" readonly rows=1></textarea>
</div>
<a href="javascript:" arid=700040001 artype="Control" ardbn="Btn_Chart" class="btn btnurl arfid700040001 ardbnBtn_Chart" style="top:5&#59; left:842&#59; width:54&#59; height:20&#59;visibility:hidden&#59;z-index:998&#59;background-color:transparent&#59;"><div class="btntextdiv" style="top:0&#59; left:0&#59; width:54&#59; height:20&#59;"><div class="f7" style="&#59;width:54">流 程 图</div>
</div>
</a>
<a href="javascript:" arid=809041101 artype="Control" ardbn="Btn_AddDate" class="btn btnurl arfid809041101 ardbnBtn_AddDate" style="top:5&#59; left:916&#59; width:65&#59; height:20&#59;visibility:hidden&#59;z-index:1004&#59;background-color:transparent&#59;"><div class="btntextdiv" style="top:0&#59; left:0&#59; width:65&#59; height:20&#59;"><div class="f7" style="&#59;width:65">补充资料</div>
</div>
</a>
<a href="javascript:" arid=700040078 artype="Control" ardbn="Btn_Shengchengzhishi" class="btn btnurl arfid700040078 ardbnBtn_Shengchengzhishi" style="top:31&#59; left:841&#59; width:65&#59; height:20&#59;visibility:hidden&#59;z-index:1003&#59;background-color:transparent&#59;"><div class="btntextdiv" style="top:0&#59; left:0&#59; width:65&#59; height:20&#59;"><div class="f7" style="&#59;width:65">生 成 知 识</div>
</div>
</a>
**<a href="javascript:" arid=700040002 artype="Control" ardbn="Btn_Edit" class="btn btn3d  btnd arfid700040002 ardbnBtn_Edit" style="top:32&#59; left:916&#59; width:65&#59; height:20&#59;visibility:hidden&#59;z-index:999&#59;"><div class="btntextdiv" style="top:0&#59; left:0&#59; width:65&#59; height:20&#59;"><div class="f1" style="&#59;width:65">处　理</div>
</div>
</a>**
<div arid=700000003 artype="Char" ardbn="BaseSN" class="df  dfro arfid700000003 ardbnBaseSN" style="z-index:995&#59;top:7&#59; left:592&#59; width:198&#59; height:20&#59;">
<label class="label f6" for="x-arid700000003" style="top:4&#59; left:0&#59; width:51&#59; height:16&#59;">流水号：</label><textarea class="text sr  dat" wrap="off" id="arid700000003" cols="20" maxlen=254 style="top:0&#59; left:52&#59; width:146&#59; height:20&#59;" readonly rows=1></textarea>
</div>
<div arid=700000004 artype="Char" ardbn="BaseCreatorFullName" class="df  dfro arfid700000004 ardbnBaseCreatorFullName" style="z-index:996&#59;top:7&#59; left:252&#59; width:122&#59; height:20&#59;">
<label class="label f6" for="x-arid700000004" style="top:4&#59; left:0&#59; width:60&#59; height:16&#59;">建单人名：</label><textarea class="text sr  dat" wrap="off" id="arid700000004" cols="20" maxlen=254 style="top:0&#59; left:61&#59; width:61&#59; height:20&#59;" readonly rows=1></textarea>
</div>
<div arid=806000100 artype="Char" ardbn="Status" ardcf=1 class="df  dfro arfid806000100 ardbnStatus" style="z-index:1002&#59;top:7&#59; left:110&#59; width:134&#59; height:20&#59;">
<label class="label f6" for="x-arid806000100" style="top:4&#59; left:0&#59; width:38&#59; height:16&#59;color:&#59;">状态：</label><textarea class="text sr  dat" wrap="off" id="arid806000100" cols="20" maxlen=254 style="top:0&#59; left:39&#59; width:95&#59; height:20&#59;" readonly rows=1></textarea>
</div>
<div arid=700000006 artype="Time" ardbn="BaseCreateDate" class="df  dfro arfid700000006 ardbnBaseCreateDate" style="z-index:997&#59;top:7&#59; left:386&#59; width:194&#59; height:20&#59;">
<label class="label f6" for="arid700000006" style="top:4&#59; left:0&#59; width:60&#59; height:16&#59;">登记时间：</label><input id="arid700000006" class="text  dat" type="text" style="top:0&#59; left:61&#59; width:133&#59; height:20&#59;" readonly ds=0 />
</div>
<div arid=700030001 artype="PageHolder" armaxh=22 class="PageHolder arfid700030001 ardbnPag_Main" style="top:52&#59; left:12&#59; width:973&#59; height:419&#59;background-color:white&#59;z-index:1000&#59;">
<div class="TabChildMissingBorder" style="visibility:hidden&#59;top:22&#59;width:973">
</div>
<div style="visibility:hidden&#59;height:22&#59;width:973" class="OuterTabsDiv">
<div class="ScrollingTab" style="position:relative&#59;float:left&#59;">
<span class="TabLeftRounded">&nbsp;</span>
<span class="Tab"><a href="javascript:" class="btn" id="prevTab">&lt;&lt;</a>
</span>
<span class="TabRightRounded">&nbsp;</span>
</div>
<div class="TabsViewPort" style="position:relative&#59;overflow:hidden&#59;float:left&#59;width:5000&#59;height:22">
<div style="overflow:visible&#59;float:left&#59;width:5000&#59;top:0&#59;left:0">
<dl class="OuterOuterTab">
<dd class="OuterTab" artabid=700030002><span class="TabLeftRounded">&nbsp;</span>
<span class="Tab"><a href="javascript:" class="btn f1">基　　本</a>
</span>
<span class="TabRight">&nbsp;</span>
</dd>
<dd class="OuterTab" artabid=806842007><span class="TabLeft">&nbsp;</span>
<span class="Tab"><a href="javascript:" class="btn f1">事件信息</a>
</span>
<span class="TabRight">&nbsp;</span>
</dd>
<dd class="OuterTab" artabid=700030094><span class="TabLeft">&nbsp;</span>
<span class="Tab"><a href="javascript:" class="btn f1">流程记录</a>
</span>
<span class="TabRightRounded">&nbsp;</span>
</dd>
</dl>
</div>
</div>

Look page source BOLD part , it is a BUTTON on the web page(arid=700040002 artype="Control" ardbn="Btn_Edit" ) . When this page is full loaded , i want to push the BUTTON in delphi .

"DEAL" is not a button, but it does have a "onclick" event, however, I don't see you assign an event to it, maybe one of the ".js" files assigns it. What you want to do, is add an "id" attribute to the "DEAL" div, let's say 'id="btn_deal"' and do document.getElementById('btn_deal').click(); I would strongly recommend using jQuery which would simplify things a lot, with jQuery you can do $("div.f1").click(); — , Jul 12 '12 at 13:50
I am using Delphi + TWebbrowser to access a site,and want to push the "button" DEAL in the page — Ti9eR, Jul 12 '12 at 14:12
@Dorin, I don't think the asker in empowered to change the Web page like that. I suspect this person is seeking to automatically operate an online poker site. — Rob Kennedy, Jul 12 '12 at 14:12
@RobKennedy yes, but in order to do that, you need to call javascript functions, I'm not aware of other way... I believe TWebBrowser allows you to call javascript within the page and modify the DOM, if not, then chromium embedded is your best bet. — , Jul 12 '12 at 14:37
I suspect the anchor element triggers the click. you could iterate the document elements and locate it via the `arid` attribute, then click it. I can only guess without the scripts and css... — kobik, Jul 12 '12 at 15:36
@Ti9eR Kobik has a point here. You can use firefox with firebug to find out the link — whosrdaddy, Jul 12 '12 at 15:38

whosrdaddy · Accepted Answer · 2012-07-12T15:40:49.257

2

This should do it:

procedure ClickElementByContent(Document : IDispatch; TagFilter : WideString; Content: WideString);

var Doc   : IHTMLDocument3;
    El    : IHTMLElement;
    Elements : IHTMLElementCollection;
    Index    : Integer;

begin
 Doc := Document as IHTMLDocument3;
 if Assigned(Doc) then
  begin
   Elements := Doc.getElementsByTagName(TagFilter);
   for Index := 0 to Pred(Elements.length) do
    begin
     El := Elements.item(EmptyParam, Index) as IHTMLElement;
     if ContainsText(El.innerText, Content) then
      begin
       El.Click;
       Break;
      end;
    end;
  end;
end;

how to use:

procedure clickthebutton;
begin
 ClickElementByContent(Webbrowser1.Document, 'DIV', 'DEAL');
end;

edited Jul 12 '12 at 15:40

answered Jul 12 '12 at 14:49

whosrdaddy

11,720
4
50
99

1

In my page source code,does not exist the ID or Name of "button",if exist : can execute WebBrowser.OleObject.document.all.item('btnName').click; OR WebBrowser.OleObject.document.getElementByID('btnID').click; – Ti9eR Jul 12 '12 at 15:01
1

+1, this is the approach I would have made also (by iterating the elements and locating the target element by it's unique properties/attributes). I would only suggest to break the loop after you click the element. – kobik Jul 12 '12 at 15:38
@whosrdaddy ： thanks for your help. your code can get DIV in "Toolbar" only , the "DEAL" DIV is in "FormContainer". I have modified web page source code, pls help again . – Ti9eR Jul 13 '12 at 06:37
@Ti9eR : can you please show the code where you actually click the button? I suspect you're doing something wrong... – whosrdaddy Jul 13 '12 at 11:28
@whosrdaddy : Can I email the captured web page image and page soure code to you ? – Ti9eR Jul 14 '12 at 05:36
can't you share the URL?, that would be easier for me. If you can't you can always make a pastebin. – whosrdaddy Jul 14 '12 at 06:15
The site is in enterprise's LAN , can not access from internet . – Ti9eR Jul 14 '12 at 07:26
Full page source code is too long,now i modified the source code,it contains chinese,hope you can understand. – Ti9eR Jul 14 '12 at 08:00

score 0 · Answer 2 · answered Jul 19 '12 at 03:09

procedure TTrackITOrderForm.Btn_DealClick(Sender: TObject);
var
Document : IHTMLDocument2 ;
ButtonDiv , temp : IHTMLElement ;
ElementCount , I : Integer ;
begin
Document := wb1.Document as IHTMLDocument2 ;
ElementCount := Document.all.length ;
for i := i to ElementCount-1 do
begin
temp := Document.all.item(i,'') as IHTMLElement ;
lst1.Items.Add(temp.id+'-->'+temp.innerText)  ;
if (temp.tagName = 'DIV') and (temp.innerText = '处理') then
begin
ShowMessage(temp.innerText);
ButtonDiv := temp ;
Break ;
end;
end;
if ButtonDiv <> nil then
ButtonDiv.click ;
end;

How to push the button in the web page like this?

2 Answers2

Linked