时间戳

首页 > 解决方案 > 自动选择浏览器列表框

javascript - 自动选择浏览器列表框

问题描述

我试图在网络浏览器中进行一些自动化。我使用 C# 和 chromuim 来运行浏览器，所以我需要在代码中使用一些 JavaScript。现在的问题是有一个包含一些项目的列表框，我可以在那里自动单击，但我无法选择一个项目，因为它没有 id 或名称或类或标记名，选择项目后我只得到一个类名. 这是选择之前的一个例子：

<span data-index="0" data-value="1" onclick="sp.setAnswer(this, true);">Less than 1 hour</span>

这是选择后的一个例子：

<span data-index="0" data-value="1" onclick="sp.setAnswer(this, true);" data-cur-index="0" class="surveyDropSelected">Less than 1 hour</span>

我只想选择一个随机项目然后提交。谢谢。

这是完整的 HTML：

div class="surveyQuestionContainer">
<div class="surveyQuestion">
  <span class="surveyQuestionText">Enter the city in which you live.</span>
  <div class="surveyQuestionAnswers">
    <div class="questionDropdownContainer valignMiddle" onclick="sp.showSlctMenu(event, this);"><span class="arrow"></span><span class="surveyDropdownVal" data-value="1">Abakan</span>
      <div class="questionDropdownOptions" style="display: none; max-height: 210px;"><span data-index="0" data-value="1" onclick="sp.setAnswer(this, true);" class="surveyDropSelected" data-cur-index="0">Abakan</span><span data-index="1" data-value="2" onclick="sp.setAnswer(this, true);" class="">Abansky district</span><span data-index="2"
          data-value="3" onclick="sp.setAnswer(this, true);" class="">Abatsky district</span><span data-index="3" data-value="4" onclick="sp.setAnswer(this, true);">Abdulino</span><span data-index="4" data-value="5" onclick="sp.setAnswer(this, true);">Abdulinsky district</span>
        <span
          data-index="5" data-value="6" onclick="sp.setAnswer(this, true);">Abinsky district</span><span data-index="6" data-value="7" onclick="sp.setAnswer(this, true);">Abysky district</span><span data-index="7" data-value="8" onclick="sp.setAnswer(this, true);">Abzelilovsky district</span><span data-index="8" data-value="9"
            onclick="sp.setAnswer(this, true);">Achinsk</span><span data-index="9" data-value="10" onclick="sp.setAnswer(this, true);">Achinsky district</span><span data-index="10" data-value="11" onclick="sp.setAnswer(this, true);">Achitsky district</span>
          <span
            data-index="11" data-value="12" onclick="sp.setAnswer(this, true);">Achkhoy-Martanovsky district</span><span data-index="12" data-value="13" onclick="sp.setAnswer(this, true);">Adamovsky district</span><span data-index="13" data-value="14" onclick="sp.setAnswer(this, true);">Adyge-Khablsky district</span>
            <span
              data-index="14" data-value="15" onclick="sp.setAnswer(this, true);">Adygeya</span>

标签： javascript

解决方案

我认为并希望此代码对您有所帮助

<script>
     // Get all possible options within div with questionDropdownOptions Class
            var questionOptions = document.querySelectorAll('.questionDropdownOptions > [data-value]');
            // Count the options
            var OptionsCount = questionOptions.length;

            /**
             * I think this loop is not needed, I think the onclick function on the span will take care of it
             * Remove the class surveyDropSelected from the selected option
             */
            for (var i = 0; i < OptionsCount; i++) {
              questionOptions[i].classList.remove('surveyDropSelected')
            }

            // Pick a random index number
            var randomNumber = Math.floor(Math.random() * (OptionsCount + 1));

            // Click a random option
            questionOptions[randomNumber].click();
</script>

推荐阅读