VBA 및 HTML을 사용하여 자동 완성 목록에서 항목을 클릭하십시오.


13

웹 사이트에 세부 정보를 입력 할 수있는 자동화를 만들었습니다 (내부로 공유 할 수는 없지만). 아래 코드는 "수신 대상"에 텍스트를 입력 할 때까지만 작동합니다. 그러나이 "수신 대상"필드에는 자동 완성 목록이 있으며 TIN 및 주소와 같은 다른 필드를 채우려면이 필드를 선택해야합니다.

자동 완성 목록은 https://jqueryui.com/autocomplete/ 또는 http://demos.codexworld.com/autocomplete-textbox-using-jquery-php-mysql/ 의 목록과 매우 유사합니다.

아래는 내 코드입니다.

Sub Automate_IE_Enter_Data()
'This will load a webpage in IE
Dim i               As Long
Dim Url             As String
Dim IE              As InternetExplorer
Dim objElement      As Object
Dim objCollection   As Object
Dim HWNDSrc         As Long
Dim wsTemplate      As Worksheet
Dim objEvent        As Object
Dim li_arr          As Variant
Dim NodeList        As Object
Dim x               As Long


Set wsTemplate = ThisWorkbook.Sheets("Template")

'Create InternetExplorer Object
Set IE = New InternetExplorerMedium

'Set IE.Visible = True to make IE visible, or False for IE to run in the background
IE.Visible = True

'Define URL by getting the value in rngURL; can be found in the main sheet
Url = "http://URL Path"

'Navigate to URL
IE.Navigate Url

' Statusbar let's user know website is loading
Application.StatusBar = Url & " is loading. Please wait..."

Do
DoEvents
Loop Until IE.ReadyState = READYSTATE_COMPLETE

'Webpage Loaded
Application.StatusBar = Url & " Loaded"

'Get Window ID for IE so we can set it as activate window
HWNDSrc = IE.hwnd
'Set IE as Active Window
SetForegroundWindow HWNDSrc
ShowWindow IE.hwnd, SW_SHOWMAXIMIZED

Dim Doc As HTMLDocument
Set Doc = IE.document

inputString = "Nuevo"

With Doc.getElementById("supName")

    .Focus
    SendKeys inputString 'Trigger the field to show autocomplete list

End With

'----THIS IS WHERE I AM TRYING TO CLICK THE AUTOCOMPLETE LIST THAT IS BEING DISPLAYED-----
'-----HOWEVER, CLICKING DOESN'T SEEM TO WORK.-----

Set NodeList = Doc.querySelectorAll(".ui-active-menuitem[role=""menuitem""]")

For x = 0 To NodeList.Length - 1
'Debug.Print NodeList.Item(x).Click '<==this way
NodeList.Item(x).Focus
NodeList(x).Click   '<==Or this method

Next x


MsgBox "Done"

'Unload IE
endmacro:
Set IE = Nothing
Set objElement = Nothing
Set objCollection = Nothing

End Sub

아래는 내 문제를 이해하는 데 도움이되는 HTML입니다.

'----- NAME OF THE FIELD THAT HAS AN AUTOCOMPLETE LIST----
<INPUT name=supName class="required-placeholder simple-placeholder ui-autocomplete-input placeholding" id=supName role=textbox aria-haspopup=true aria-autocomplete=list type=text value=Required jQuery17102032699680461189="39" placeholder="Required" autocomplete="off">

<UL class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role=listbox aria-activedescendant=ui-active-menuitem style="WIDTH: 400px; LEFT: 751px; Z-INDEX: 1; DISPLAY: none; TOP: 287px" jQuery17102032699680461189="42"><LI class=ui-menu-item role=menuitem jQuery17102032699680461189="104"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="114">List 0</A></LI>

<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="105"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="115">List 1</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="106"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="116">List 2</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="107"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="117">List 3</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="108"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="118">List 4</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="109"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="119">List 5</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="110"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="120">List 6</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="111"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="121">List 7</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="112"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="122">List 8</A></LI>
<LI class=ui-menu-item role=menuitem jQuery17102032699680461189="113"><A tabIndex=-1 class=ui-corner-all jQuery17102032699680461189="123">List 9</A></LI></UL>

자동 완성 목록의 샘플 스크린 샷 :

여기에 이미지 설명을 입력하십시오

더 많은 HTML :

<DIV class="ui-tabs-panel ui-widget-content ui-corner-bottom" id=ui-tabs-1 jQuery17109198838813964318="12">

  <FORM id=receiptEntryForm action=/ReceiptEntry/SaveReceipt method=post jQuery17109198838813964318="40">

    <DIV id=receipt-entry>
      <DIV class=receipt-content>
        <DIV class=content-label>
          <LABEL>OR No:</LABEL>
          <LABEL>Date:</LABEL>
          <LABEL>Received From:</LABEL>
          <LABEL>TIN:</LABEL>
          <LABEL>Address:</LABEL> </DIV>
        <DIV class=content-input>
          <INPUT name=ReceiptNumber disabled id=ReceiptNumber type=text data-val-required="The ReceiptNumber field is required." data-val-number="The field ReceiptNumber must be a number." data-val="true">

          <INPUT name=printDate class="datepicker hasDatepicker" id=printDate type=text jQuery17109198838813964318="38">

          <INPUT name=supName class="required-placeholder simple-placeholder ui-autocomplete-input placeholding" id=supName role=textbox aria-haspopup=true aria-autocomplete=list type=text value=Required jQuery17109198838813964318="39" placeholder="Required" autocomplete="off">

          <INPUT name=SupplierCode id=SupplierCode type=hidden data-val-required="The SupplierCode field is required." data-val="true" data-val-length-max="20" data-val-length="You&amp;#39;ve reached the maximum length allowed.">

          <INPUT name=SupTIN class="required-placeholder placeholding simple-placeholder" id=SupTIN type=text value=Required jQuery17109198838813964318="41" placeholder="Required" ,>

          <TEXTAREA name=SupAdd class="textarea-wide required-placeholder" id=SupAdd rows=3 cols=48 placeholder="Required"></TEXTAREA>
        </DIV>
      </DIV>
      <DIV class=editor-label>
        <LABEL id=sum-label>The sum of ****:</LABEL>
        <LABEL class=grayed-out id=total-amount-words></LABEL>
        <LABEL class=right id=total-amount></LABEL>
      </DIV>
      <BR>
      <BR>
      <BR>
      <DIV id=receipt-selection>
        <DIV class=content-label>
          <LABEL id=receipt-type-label>Receipt Type:</LABEL>
          <LABEL for=chk-vatable>VATable Receipt:</LABEL>
          <H5>IN PAYMENT OF</H5>
          <BR>
        </DIV>
        <DIV class=content-iput>
          <SELECT id=receiptentry-type jQuery17109198838813964318="36">
            <OPTION value=cr selected>Collection Receipt</OPTION>
            <OPTION value=or>Official Receipt</OPTION>
          </SELECT>
          <BR>
          <INPUT disabled id=chk-vatable type=checkbox jQuery17109198838813964318="37"> </DIV>
        <DIV id=receiptentry-receipt-table>
          <DIV>
            <TABLE>
              <THEAD>
                <TR>
                  <TH>INVOICE NO.</TH>
                  <TH>AMOUNT</TH>
                  <TH colSpan=3>FORM OF PAYMENT</TH>
                  <TH>AMOUNT</TH>
                </TR>
              </THEAD>
              <TBODY id=receipt-entry-table1>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice0 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount0 contentEditable=true jQuery17109198838813964318="44"></SPAN>
                  </TD>
                  <TD class="bold left-align" colSpan=3>CASH</TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=table1-cash-amount contentEditable=true jQuery17109198838813964318="53"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice1 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount1 contentEditable=true jQuery17109198838813964318="45"></SPAN>
                  </TD>
                  <TH>BANK</TH>
                  <TH>CHECK NO.</TH>
                  <TH>DATE</TH>
                  <TD>
                    <SPAN class="table1-amount2 right-align" jQuery17109198838813964318="54"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice2 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount2 contentEditable=true jQuery17109198838813964318="46"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname0 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck0 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate0 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount0 contentEditable=true jQuery17109198838813964318="55"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice3 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount3 contentEditable=true jQuery17109198838813964318="47"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname1 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck1 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate1 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount1 contentEditable=true jQuery17109198838813964318="56"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice4 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount4 contentEditable=true jQuery17109198838813964318="48"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname2 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck2 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate2 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount2 contentEditable=true jQuery17109198838813964318="57"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice5 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount5 contentEditable=true jQuery17109198838813964318="49"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname3 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck3 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate3 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount3 contentEditable=true jQuery17109198838813964318="58"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice6 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount6 contentEditable=true jQuery17109198838813964318="50"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname4 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck4 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate4 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount4 contentEditable=true jQuery17109198838813964318="59"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice7 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount7 contentEditable=true jQuery17109198838813964318="51"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname5 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck5 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate5 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount5 contentEditable=true jQuery17109198838813964318="60"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD>
                    <SPAN class="table1-invoice left-align" id=invoice8 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount1 right-align" id=invamount8 contentEditable=true jQuery17109198838813964318="52"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-bank left-align" id=bankname6 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-check left-align" id=bankcheck6 contentEditable=true></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-date center-align" id=bankdate6 contentEditable=true name="date"></SPAN>
                  </TD>
                  <TD>
                    <SPAN class="table1-amount2 right-align" id=bankamount6 contentEditable=true jQuery17109198838813964318="61"></SPAN>
                  </TD>
                </TR>
                <TR>
                  <TD class=td-title>TOTAL</TD>
                  <TD>
                    <SPAN class=right-align id=table1-amount1-total contentEditable=true></SPAN>
                  </TD>
                  <TD colSpan=3></TD>
                  <TD>
                    <SPAN class=right-align id=table1-amount2-total contentEditable=true></SPAN>
                  </TD>
                </TR>
              </TBODY>
            </TABLE>
          </DIV>
        </DIV>
      </DIV>
      <BR>
      <LABEL>THIS CANCELS OUR P.R.#</LABEL>
      <INPUT name=CancelPrNo id=CancelPrNo type=text data-val="true" data-val-length-max="50" data-val-length="You&amp;#39;ve reached the maximum length allowed.">
      <INPUT class="right button-style" id=add-receipt type=button value=Add jQuery17109198838813964318="43"> </DIV>
  </FORM>
</DIV>

크롬 콘솔 :

여기에 이미지 설명을 입력하십시오

자동 완성 목록 요소 검사 :

<UL class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role=listbox aria-activedescendant=ui-active-menuitem style="WIDTH: 400px; LEFT: 559px; Z-INDEX: 1; DISPLAY: block; TOP: 287px" jQuery17100985129077826366="42">
<LI class=ui-menu-item role=menuitem jQuery17100985129077826366="62" sizcache02782874225672333="1" sizset="0">
<A tabIndex=-1 class=ui-corner-all jQuery17100985129077826366="63">
*TEXT RESULT OF THE AUTOCOMPLETE LIST*
</A>
</LI></UL>

안녕하세요, 어리석은 제안이 아니길 바랍니다.하지만 찾고있는 옵션의 색인을 찾을 수 있습니까 (입력 필드를 입력 한 후 직접 계산하십시오.이 필드에는 색인이없는 것 같습니다) .selectedIndex = xsupName의 요소?
St3ve

안녕하세요, 이것을 확인했지만 제어하려고하는 필드는 드롭 다운 목록이 아닙니다. 오히려 jquery로 항목을 표시하는 필드입니다.
Sevpoint

HTML 소스는 어디서 구했습니까? "소스보기"에서 가져온 것이면 최종 HTML을 반영하지 않을 수 있습니다. 개발자 도구

@TimWilliams 안녕하세요, inspect 요소에서 HTML 소스를 얻었습니다. 먼저 필드를 입력하고 (몇 글자 만 입력) 자동 완성 목록이 나타날 때까지 기다립니다. 일단 등장하면 개발자 관리자가 요소를 검사했습니다. 그리고 위의 HTML을 얻었습니다.
Sevpoint

당신 querySelectorAll이 예상되는 리튬 품목을 반환 합니까 ?
팀 윌리엄스

답변:


4

좋은 질문!

Internet Explorer는 jQuery 사용자 정의 컨트롤로 작업 할 때 내장 메소드를 사용하여 자동화하기가 매우 까다로울 수 있습니다. 고맙게도 브라우저에 JavaScript를 삽입하여 이러한 컨트롤의 기존 방법을 사용하거나 jQuery 자체 (페이지에로드 된 경우)를 사용하여 인생을 더 쉽게 만들 수 있습니다.

아래에서 수행 한 작업은 페이지를 테스트 용으로 사용 하며 자동 완성 제어 기능이 있습니다.

페이지의 올바른 요소를 가리 키도록 CSS 선택기 를 변경해야 할 수도 있지만 아래에 사용 된 메소드는 원하는 요소를 프로그래밍 방식으로 제어하는 ​​데 효과적입니다.

암호

Option Explicit

#If Win64 Then
    Public Declare PtrSafe Sub Sleep Lib "kernel32" (ByVal dwMilliseconds As LongPtr)
#Else
    Public Declare Sub Sleep Lib "kernel32" (ByVal dwMilliseconds As Long)
#End If

Sub AutoCompleteExamples()
    Dim ie As Object: Set ie = CreateObject("InternetExplorer.Application")
    ie.Visible = True
    LoadPage ie, "https://jqueryui.com/resources/demos/autocomplete/default.html"

    'Trigger autocomplete with jQuery. This select the first ui-autocomplete-input, you may need -
    'to adjust this, if this isn't the first autocomplete control on page
    ie.document.parentWindow.execScript "$('.ui-autocomplete-input').first().val('A').autocomplete('search')"

    'Select first item with jQuery, the UL updates in response to the click event
    'Result should be it selected 'ActionScript'
    ie.document.parentWindow.execScript "$('ul.ui-menu').children().first().click()"

    'Alternatively if you want to pick an item from the drop down with a specific value
    'You can look inside the ul-menu-items that are created and use Contains. The contains method is case sensitive
    ie.document.parentWindow.execScript "$('ul.ui-menu').children().find('.ui-menu-item-wrapper:contains(""ActionScript"")').click()"
End Sub

Public Sub LoadPage(ByRef ie As Object, ByVal URL As String)
    With ie
        .Navigate URL
        Sleep 500 'Add a built in delay
        Do While .busy And .readystate <> 4: DoEvents: Loop
        Sleep 500 'Add a built in delay
    End With
End Sub

1
이 답변에 감사드립니다. 내가 지금까지 몰랐던 방법. :-)
Zwenn

@ Zwenn 감사합니다! :)
Ryan Wildry

@RyanWildry에게 감사합니다 $('input#supName').first().val('A').autocomplete('search'). 요소를 교체하여 내부 사이트에서 작업했습니다 . 아무 문제없이 자동 완성을 트리거합니다. 그러나 클릭에 관해서는 작동하지 않습니다 ie.document.parentWindow.execScript "$('ul.ui-menu-item').children().find('.ui-menu-item-wrapper:contains(""ActionScript"")').click()". 질문 : 왜 내가 요소를 변경 input#supName하지 않고 작동 .supName합니까? 고마워요! 😊
Sevpoint

1
지금 일하고 있습니다! : D 다음을 클릭하기 전에이 줄을 추가했습니다 : $('ul.ui-menu').children().first().find('a').first().trigger('mouseover'). ie.document.parentWindow.execScript "$('ul.ui-menu').children().find('.ui-menu-item-wrapper:contains(""ActionScript"")').click()"문자열을 포함하는 목록을 검색해야하기 때문에 이것을 어떻게 사용할 수 있는지에 대한 질문 이 있습니다. a그러나 형식을 복사하려고 시도했지만 예상대로 작동하지 않습니다. 또한 자동 완성 목록이 없거나 일치하지 않으면 유효성 검사를하고 싶습니다.
Sevpoint

1
네, 페이지 설정에 따라 까다로울 수 있습니다. 주사 jQuery는 내가 여기서 할 일이 될 것이며, 좋은 접근 방법입니다. :)
Ryan Wildry

4

예제 페이지가 귀하의 페이지와 매우 유사하기를 바랍니다. 나는 당신이 그런 것들을 어떻게 다룰 수 있는지 보여주기 위해 그것을 사용했습니다. 머릿속에 필요한 것은 페이지의 다이나믹에 대한 생각입니다. 나는 매크로에 대해 자세히 언급했다. 이해하기 위해 모든 것을주의 깊게 읽으십시오. 솔루션은 다음 3 가지 부분으로 구성됩니다. 하나의 모듈에 모두 복사하십시오.

첫째 : 1 초 미만으로 나누는 방법. Windows api 함수를 사용하여이를 수행 할 수 있습니다.

'With the following Windows api function we can do breaks less than 1 second
'It works with Excel 32 bit an Excel 64 bit
#If Win64 Then
  'For 64 Bit Systems
  Public Declare PtrSafe Sub Sleep Lib "kernel32" (ByVal dwMilliseconds As LongPtr)
#Else
  'For 32 Bit Systems
  Public Declare Sub Sleep Lib "kernel32" (ByVal dwMilliseconds As Long)

두 번째 : 팝업 메뉴를 클릭하는 주요 부분

Sub JQueryAutocomplete()

  Dim url As String
  Dim browser As Object
  Dim nodeInput As Object
  Dim nodeUi As Object
  Dim nodeLi As Object
  Dim countOfLi As Long
  Dim controlValue As Long
  Dim searchString As String
  Dim countOfLiDone As Boolean
  Dim result As String

  'Initializing variables and load page
  '-------------------------------------------------------------------------------------------
  'Part of the string to autocomplete
  searchString = "h"

  'The controlValue shows the number of next li-tag in pop-up menu to pass through
  controlValue = 1

  'We use the iFrame document from the JQuery sample page directly
  'So we have less code overhead to reach the point we need in the HTML code
  url = "https://jqueryui.com/resources/demos/autocomplete/default.html"

  'Initialize Internet Explorer, set visibility,
  'call URL and wait until page is fully loaded
  Set browser = CreateObject("internetexplorer.application")
  browser.Visible = True 'You can set this to False because this macro don't use sendkeys()
  browser.navigate url
  Do Until browser.ReadyState = 4: DoEvents: Loop
  '-------------------------------------------------------------------------------------------

  'Try to get textbox for input
  '-------------------------------------------------------------------------------------------
  On Error Resume Next
  Set nodeInput = browser.document.getElementByID("tags")
  On Error GoTo 0

  'Check if nodeInput could be created
  If Not nodeInput Is Nothing Then
    'Loop over all auto completed strings in the pop-up menu
    'Yes, we start the loop before we know anything obout the pop-up menu
    '-----------------------------------------------------------------------------------------
    Do
      'Insert part of search string
      '---------------------------------------------------------------------------------------
      'Everytime we want to place text into the textbox, we must prepare it to react with the
      'pop-up menu. We do this by triggering the input HTML event of the textbox
      '(You do this with sendkeys in your macro. But sendkeys should be avoided if possible)
      Call TriggerEvent(browser.document, nodeInput, "input")

      'Insert text
      nodeInput.Value = searchString

      'Wait briefly to open the pop-up menu
      'It may be that with your computer speed and your internet speed (ping) it must be a
      'larger value or it may be a smaller value. 1 counts 1 millisecond. So 100 is a tenth
      'of a second and 1000 is one second
      Sleep (500)
      '---------------------------------------------------------------------------------------

      'Count generated li tags if not done in the past
      '---------------------------------------------------------------------------------------
      If countOfLiDone = False Then
        'Try to get pop-up menu
        'It may be that there is no pop-up menu if the string does not provide auto-completion
        'It is important to know this to be able to exit the loop
        On Error Resume Next
        Set nodeUi = browser.document.getElementByID("ui-id-1")
        On Error GoTo 0

        'Check if nodeUi could be created
        'If nodeUi couldn't be created, no pop-up menu. The variable countOfLi is 0 by default
        'and less than controlValue, which is 1 by initializing. The termination condition of
        'the loop is thus reached immediately
        If Not nodeUi Is Nothing Then
          'Count li tags in the pop-up
          countOfLi = nodeUi.getElementsByTagName("li").Length
          countOfLiDone = True
        End If
      End If
      '---------------------------------------------------------------------------------------

      'Go on if there is a pop-up menu
      '---------------------------------------------------------------------------------------
      If countOfLi > 0 Then
        'To get the text from the next li tag into the input textbox we must click the li tag
        nodeUi.getElementsByTagName("li")(controlValue - 1).Click

        'Here you can do what you want with the new situation of the page
        '-------------------------------------------------------------------------------------
        'If there come up new contents you need at first a short break after the click for the
        'same reason we wait earlier in the macro, after inserting our searchString
        Sleep (500)

        'I don't know what you want to da but on the example page nothing hapen than the
        'clicked text is now in the input textbox. So we gather all clicks in a string
        'to show something at the end of macro runtime
        result = result & nodeInput.Value & Chr(13)
        '---------------------------------------------------------------------------------------
      End If
      '---------------------------------------------------------------------------------------

      'Prepare next loop pass
      '---------------------------------------------------------------------------------------
      controlValue = controlValue + 1
      '---------------------------------------------------------------------------------------
    Loop Until controlValue > countOfLi
    '-----------------------------------------------------------------------------------------
  Else
    'nodeInput couldn't be created
    result = "Textbox to insert search string not found"
  End If
  '-------------------------------------------------------------------------------------------

  'Clean up
  '-------------------------------------------------------------------------------------------
  browser.Quit
  Set browser = Nothing
  Set nodeInput = Nothing
  Set nodeUi = Nothing
  Set nodeLi = Nothing
  '-------------------------------------------------------------------------------------------

  'Show the result of this demo
  '-------------------------------------------------------------------------------------------
  MsgBox result
  '-------------------------------------------------------------------------------------------
End Sub

셋째 : HTML 이벤트를 트리거하는 기능입니다. 따라서 sendkeys ()가 필요하지 않습니다.

Private Sub TriggerEvent(htmlDocument As Object, htmlElementWithEvent As Object, eventType As String)

  Dim theEvent As Object

  htmlElementWithEvent.Focus
  Set theEvent = htmlDocument.createEvent("HTMLEvents")
  theEvent.initEvent eventType, True, False
  htmlElementWithEvent.dispatchEvent theEvent
End Sub

@ Zwenn에게 감사합니다. 이것이 바로 내가 필요한 것입니다. 그러나 내부 웹 사이트로 URL을 바꾸려고 할 때 Function TriggerEvent에 오류가 표시됩니다. 구체적으로 Set theEvent = htmlDocument.createEvent("HTMLEvents"). 참조를 살펴 봐야 할 것이 있습니까?
Sevpoint

추가하기 위해 '개체가이 속성 또는 메서드를 지원하지 않습니다'라고 표시됩니다.
Sevpoint

또한 추가하려면 : 내부 웹 사이트의 URL을 변경했을 때 TriggeEvent의 값을 확인했습니다. htmlDocument 및 htmlElementWithEvent의 값은 [object]입니다. jqueryui.com/autocomplete 와 비교하면 값은 "[object HTMLDocument]입니다.
Sevpoint

@Sevpoint URL을 변경해야만 작동하지 않습니다. 나는 일반적으로 어떻게 문제를 해결할 수 있는지에 대한 메커니즘을 보여줍니다. 내가 모르는 내부 페이지에 이것을 적용해야합니다. 게시 한 HTML 코드로 시도해 볼 수 있습니다. 하지만 내일까지는 그렇게 할 수 없습니다.
Zwenn

내가 변경 한 것을 언급하는 것을 잊었다 Set nodeInput = browser.document.getElementByID("tags")Set nodeInput = browser.document.getElementByID("supName")Set nodeUi = browser.document.getElementByID("ui-id-1")Set nodeUi = browser.document.getElementByID("ui-menu-item"). 물론 도움을 주셔서 감사합니다. 내 쪽에서 필요한 것이 있으면 알려주세요. 다른 소스보다 솔루션을 찾을 수 없기 때문에.
Sevpoint

0

LI 항목에 태그가 어떻게 포함되어 있는지 확인하십시오. 첫 번째 자식을 클릭하십시오.

대신에:

NodeList.Item(x).Focus
NodeList(x).Click  

시험:

NodeList.Item(x).Focus
NodeList(x).FirstChild.Click  

https://www.w3schools.com/jsref/prop_node_firstchild.asp


안녕하세요, Peyter, 안타깝게도 귀하의 제안을 시도해 보았습니다.
Sevpoint

예, 이와 같은 문제가 발생하면 Selenium, Puppeteer 또는 PhantomJS를 사용하게되었습니다.
Peyter
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.