JavaScript для изменения вкладок с помощью Amazon Mechanical Turk <crowd-tabs>

Question

Я использую новые теги Amazon Mechanical Turk <crowd-form> и создаю платный квалификатор с 2 вкладками, одна для инструкций и практики с нашим интерфейсом, а другая - для самого теста. Я хотел бы поместить кнопку внизу вкладки инструкций, чтобы позволить пользователю легко перейти к тестовой вкладке без необходимости прокрутки до самого верха. Есть ли простой способ сделать это с помощью специальных <crowd-tabs> элементов Amazon?

Answer 1

Вам на самом деле не нужен JavaScript для этого.

Вот пример кода, который этого достигает:

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>

<crowd-form>
  <crowd-tabs id="tabs">
    <crowd-tab header="Tab 1">
      Tab 1 content
    </crowd-tab>

    <crowd-tab header="Tab 2">
      Tab 2 content
    </crowd-tab>
  </crowd-tabs>
</crowd-form>

<crowd-button onclick="tabs.activeIndex=0">
  Tab 1
</crowd-button>

<crowd-button onclick="tabs.activeIndex=1">
  Tab 2
</crowd-button>

А вот рабочий JSFiddle https://jsfiddle.net/py91rekd.

Всего наилучшего,

Amazon Mechanical Turk