JavaScript 代码似乎无法按预期用于 xml 元素

问题描述 投票:0回答:0

我现在基本上只是尝试仅当行元素“Blue”出现在屏幕上时才显示“Blue OTHER”列(而不是时应该隐藏)。目前,当“蓝色”行作为卡片出现在屏幕上时,“蓝色其他”列保持隐藏状态。

我似乎无法正常工作。如果有任何考虑,问题就在 https://forstasurveys.zendesk.com/hc/en-us 平台内。

这是我当前的代码:

<radio 
  label="Q1"
  cardsort:displayCounter="0"
  shuffle="rows"
  uses="cardsort.6">
  <title>Select a feeling associated with each colour</title>
  <comment>Place each card into a bucket.</comment>
  <style name="question.after"><![CDATA[
<style name="question.after">
  #question_Q1 > div.sq-cardsort.sq-cardsort-Q1.sq-cardsort-mobile > div.sq-cardsort-body > div.sq-cardsort-buckets-view > ul > li.sq-cardsort-bucket.sq-cardsort-bucket-c5.ui-droppable {
    display: none !important;
  }
</style>

<script>
  const blueRow = document.querySelector('.blueRow');
  const blueOther = document.querySelector('#question_Q1B > div.sq-cardsort.sq-cardsort-Q1B.sq-cardsort-mobile > div.sq-cardsort-body > div.sq-cardsort-buckets-view > ul > li.sq-cardsort-bucket.sq-cardsort-bucket-c5.ui-droppable');

  blueRow.addEventListener('click', () => {
    blueOther.style.display = 'table-cell';
  });
</script>
]]></style>
  <row label="r1"><span class="blueRow">Blue</span></row>
  <row label="r2"><span class="redRow">Red</span></row>
  <row label="r3">Green</row>
  <row label="r4">Yellow</row>
  <row label="r5">Pink</row>
  <row label="r6">Purple</row>
  <row label="r7">Orange</row>
  <row label="r8">Black</row>
  <row label="r9">White</row>
  <row label="r10">Gray</row>
  <col label="c1">Happiness</col>
  <col label="c2">Excitement</col>
  <col label="c3">Power</col>
  <col label="c4">Sadness</col>
  <col label="c5" open="1" openSize="25" randomize="0"><span class="blueCol">Blue OTHER</span></col>
  <col label="c6" open="1" openSize="25" randomize="0"><span class="redCol">Red OTHER</span></col>
  <col label="c7" open="1" openSize="25" randomize="0">Green OTHER</col>
  <col label="c8" open="1" openSize="25" randomize="0">Yellow OTHER</col>
  <col label="c9" open="1" openSize="25" randomize="0">Pink OTHER</col>
  <col label="c10" open="1" openSize="25" randomize="0">Purple OTHER</col>
  <col label="c11" open="1" openSize="25" randomize="0">Orange OTHER</col>
  <col label="c12" open="1" openSize="25" randomize="0">Black OTHER</col>
  <col label="c13" open="1" openSize="25" randomize="0">White OTHER</col>
  <col label="c14" open="1" openSize="25" randomize="0">Gray OTHER</col>
</radio>

非常感谢任何帮助或建议。

javascript css xml dom
© www.soinside.com 2019 - 2024. All rights reserved.