主页 / 问题

问题[javascript]

Martin Hope
Arame Barseghyan
Asked: 2025-05-01 00:47:48 +0000 UTC
  • 5

请给我一些关于如何改进代码的建议？

goto(Math.random() * 600 - 300, Math.random() * 600 - 300);
let s = 0;

for (let index = 0; index < 60; index++) {
  let a = Math.random();
  let b = Math.random();
  if (s === 0) {
    colour(127, 0, 255, 1);
  } else if (s === 1) {
    colour(250, 156, 28, 1);
  } else if (s === 2) {
    colour(0, 120, 255, 1);
  }
  forward(Math.random() * 150);
  if (a > b) {
    left(90);
  } else {
    right(90);
  }
  s = (s + 1) % 3;
}
javascript
Martin Hope
alexkolykhalov
Asked: 2025-04-30 16:52:23 +0000 UTC
  • 6
button.addEventListener("click", function() {
  const ce = new CustomEvent(
    "board:select",
    { bubbles: false, cancelable: true, detail: {} }
  );

  const isCancelled = !document.querySelector(`#${Board.prefix}`)?.dispatchEvent(ce);

  console.log(isCancelled ? "is cancelled" : "is not cancelled");
}

//I вариант
document.querySelector(`#${Board.prefix}`)?.addEventListener("board:select", function() {
  event.preventDefault();
})

//II вариант
document.querySelector(`#${Board.prefix}`)?.addEventListener("board:select", async function() {
  const data = await fetch("http://localhost:4000/boards"); 
  event.preventDefault();
})

有一个简单的代码，当按下按钮时会发送一个事件。

问题：为什么第一个选项中 isCancelled 为真，而第二个选项中 isCancelled 为假。

我想等到 fetch 执行完毕然后设置 event.preventDefault();或不放。现在在第二个选项中 event.preventDefault();不起作用。

告诉我发生了什么事？

javascript
Martin Hope
alexWithoutBeard
Asked: 2025-04-28 20:34:32 +0000 UTC
  • 5

有必要实现 getSrc()，它接收一段有效的（即没有错误编写的）html 代码作为输入，该代码可以包含多个图像。获取图像的src属性的值。该属性可以用单引号或双引号引起来，例如，src="test.png", src='test.png'。

src 返回字符串

我得到以下信息：

function getSrc(html) {
  let str = html.toLowerCase();
  let pos = 0;
  let res = ''
  let k = str.indexOf('<img ');
  let src = str.indexOf("src=", k);
  while (str.indexOf('<img ', pos + 1) != -1) {
    let open =
      str.indexOf('"', src) != -1 ?
      str.indexOf('"', src) :
      str.indexOf("'", src);
    let close =
      str.indexOf('"', open + 1) != -1 ?
      str.indexOf('"', open + 1) :
      str.indexOf("'", open + 1);
    pos += close;
    res += str.slice(open + 1, close) + ' ';

  }

  return res

}

getSrc('<table><tr><td><img width="200" src="google.jpg"></td></tr><tr><td><img width="200" src='
  chrome.jpg '></td></tr><tr><td><img width="200" src="safari.jpg"></td></tr><tr><td><img width="200" src="edge.jpg"></td></tr></table>')

它应该输出：google.jpg chrome.jpg safari.jpg edge.jpg。我得到：google.jpg google.jpg google.jpg google.jpg

我明白错误在于我将相同的 src 传递给 while，但如何修复它......有趣的是我在 React 中编写组件，但我被这个困住了）

javascript
Martin Hope
Arame Barseghyan
Asked: 2025-04-28 00:24:19 +0000 UTC
  • 5
let flowers = [
    [100, 100, 80],
    [-200, 65, 120],
    [111, -226, 120],
    [-52, -288, 56],
    [-15, 271, 70],
    [252, -11, 45]
];

let colors = [
    [52, 152, 219],
    [160, 64, 0],
    [39, 174, 96],
    [127, 179, 213],
    [46, 64, 83],
    [192, 57, 43]
];

colour(52, 152, 219, 1)
for (let index = 0; index < 45; index++) {
    goto(flowers[0][0], flowers[0][1])
    left(10)
    forward(flowers[0][2])

}
colour(160, 64, 0, 1)
for (index = 0; index < 45; index++) {
    goto(flowers[1][0], flowers[1][1])
    left(10)
    forward(flowers[1][2])

}
colour(39, 174, 96, 1)
for (index = 0; index < 45; index++) {
    goto(flowers[2][0], flowers[2][1])
    left(10)
    forward(flowers[2][2])

} colour(127, 179, 213, 1)
for (index = 0; index < 45; index++) {
    goto(flowers[3][0], flowers[3][1])
    left(10)
    forward(flowers[3][2])

} colour(46, 64, 83, 1)
for (index = 0; index < 45; index++) {
    goto(flowers[4][0], flowers[4][1])
    left(10)
    forward(flowers[4][2])

}
colour(192, 57, 43, 1)
for (index = 0; index < 45; index++) {
    goto(flowers[5][0], flowers[5][1])
    left(10)
    forward(flowers[5][2])

}

因此，在 [] 中我写了索引，但在这种情况下代码本身不起作用，但除此之外一切都很好，我该如何修复它？

javascript
Martin Hope
Dina
Asked: 2025-04-27 23:14:47 +0000 UTC
  • 5

继续这个问题

如果不为 0，则需要将每个组中的值传递给特定的输入

const btnsVal = [];
// Функция пересчитывает итоговую сумму
function calcPrice() {
  $('#tprice1 div').html(Math.trunc(+$('#price_old').val() * (1 + btnsVal.reduce((i, c) => i + c, 0) * 15 / 100)) + ' ₽'); // 15%
  $('#price2').val(Math.trunc(+$('#price_old').val() * (1 + btnsVal.reduce((i, c) => i + c, 0) * 15 / 100)));
}
// Запускается, когда document полностью отрисован в браузере
$(document).ready(function() {
  // Берем контейнер для кнопок
  const btns = $('#btns');
  // Размещаем в цикле 3 группы кнопок
  for (let i = 0; i < 3; i++) {
    // Добавляем начальное значение для каждой группы 
    btnsVal.push(0);
    // В input добавлен id группы для облегчения идентификации + в data атрибут положено минимально допустимое значение
    // В кнопки/ссылки добавлен класс clickBtn для селектора
    btns.html(btns.html() + `<div class="quantity_inner">
            <a href="javascript:;" class="clickBtn bt_minus z-depth-1">
                <svg viewBox="0 0 24 24"><line x1="5" y1="12" x2="19" y2="12"></line></svg>
            </a>
            <input type="text" value="0" size="2" class="quantity" data-max-count="4" data-min-count="0" data-idx="${i}" />
            <a href="javascript:;" class="clickBtn bt_plus z-depth-1">
                <svg viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>
            </a>
        </div>`);
  }
  // При нажатии на кнопку +/-
  $('.clickBtn').click(function() {
    // Берем значение группы
    let $input = $(this).parent().find('.quantity');
    // Изменяем значение в зависимости от того, что это за кнопка, плюс или минус
    let count = +$input.val() + ($(this).hasClass('bt_minus') ? -1 : 1);
    $('#kids_count').val(count);
    // Проверяем, не выходит ли новое значение за допустимые пределы
    if (+$input.data('min-count') <= count && +$input.data('max-count') >= count) {
      // Если не выходит, меняем значение и пересчитываем
      $input.val(count);
      btnsVal[$input.data('idx')] = count;
      calcPrice()
    }
  });

  calcPrice();
})  
.col.s8 {
    width: 60%;
    float: left;
}
.col.s4 {
    width: 40%;
    float: left;
}
.modal-kids {
    line-height: 4;
}
.quantity_inner * {
  box-sizing: border-box;
}

.quantity_inner {
  display: flex;
  justify-content: center;
}

.quantity_inner .bt_minus,
.quantity_inner .bt_plus,
.quantity_inner .quantity {
  color: #BFE2FF;
  height: 40px;
  width: 40px;
  padding: 0;
  margin: 10px 2px;
  border-radius: 10px;
  border: 4px solid #BFE2FF;
  background: #337AB7;
  cursor: pointer;
  outline: 0;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2), 0 4px 6px rgba(0, 0, 0, 0.2);
}

.quantity_inner .quantity {
  width: 50px;
  text-align: center;
  font-size: 22px;
  color: #FFF;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}

.quantity_inner .bt_minus svg,
.quantity_inner .bt_plus svg {
  stroke: #BFE2FF;
  stroke-width: 4;
  transition: 0.5s;
  margin: 4px;
}

.quantity_inner .bt_minus:hover svg,
.quantity_inner .bt_plus:hover svg {
  stroke: #FFF;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<!-- Исходное значение -->
<input name="price_old" id="price_old" type="hidden" value="790">
<form>
Значение из группы 1 <input name="kids_count1" id="kids_count1" type="text" placeholder="Автолюлька (1шт)" value=""><br>
Значение из группы 2 <input name="kids_count2" id="kids_count2" type="text" value=""><br>
Значение из группы 3 <input name="kids_count3" id="kids_count3" type="text" value=""><br><br>
<!-- или сделать один input для всех 3-х групп, через запятую value="Автолюлька (1шт), Автокресло (2шт)"-->
</form>

<input name="price2" id="price2" type="text" value="790">
<div id="tprice1" class="param__value"><div style="margin-right: 10px;color: #000;background: #ffca00;line-height: 21px;padding: 0 6px 0;border-radius: 4px;font-weight: 600;font-size: 14px;">790 ₽</div></div>

<div class="col s8">
      <div class="modal-kids">
             <strong>Группа 1 Автолюлька</strong>
             <span>До 6 месяцев</span>
      </div>
      <div class="modal-kids">
             <strong>Группа 2 Автокресло</strong>
             <span>0–7 лет</span>
      </div>
      <div class="modal-kids">
             <strong>Группа 3 Бустер</strong>
             <span>6–12 лет</span>
      </div>
</div>

<div class="col s4"><div id="btns"></div></div>

javascript