как напечатать текст javascript в форму с помощью кнопки - PullRequest
Новая
       0

как напечатать текст javascript в форму с помощью кнопки

0 голосов
/ 28 февраля 2019

Я пытаюсь объединить свои ограниченные знания HTML и JavaScript для практики и, похоже, не могу преодолеть эту проблему.Я пытаюсь сделать так, чтобы при нажатии на кнопку случайные карты появлялись в форме над кнопкой.Может быть, есть лучший способ сделать это? 

function randomCards() {
  const cards = ['diamond', 'spade', 'heart', 'club'];
  let currentCard = ''
  while (currentCard != 'spade') {
    currentCard = cards[Math.floor(Math.random() * 4)];
  }
}
<form>
  Cards:<br>
  <input type='text' name="Card Slot">
</form>
<button onclick='randomCards()'>Get Cards</button>

Ответы [ 3 ]

0 голосов
/ 28 февраля 2019

Вот ответ с минимальными изменениями в вашей структуре HTML: 

<form>
  Cards:<br>
  <input type='text' name="Card Slot">
</form>
<button onclick='randomCards()'>Get Cards</button>
<script type="text/javascript">
  function randomCards() {
    document.getElementsByName("Card Slot")[0].value = '';
    const cards = ['dimond', 'spade', 'heart', 'club'];
    let currentCard = ''
    while (currentCard != 'spade') {
      currentCard = cards[Math.floor(Math.random() * 4)];
      document.getElementsByName("Card Slot")[0].value += currentCard + ' ';
    }
  }
</script>
0 голосов
/ 28 февраля 2019 

function randomCards() {
    const cards = ['dimond', 'spade', 'heart', 'club'];
    let currentCard = ''
    while(currentCard != 'spade') {
        currentCard = cards [Math.floor(Math.random()*4)];
    }
    console.log(currentCard);
    $('#test3').val(currentCard);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<form>
  Cards:<br>
  <input type='text' id="test3" name="Card Slot">
</form>
<script src="https://code.jquery.com/jquery-3.0.0.js"></script>
<button onclick= 'randomCards()'>Get Cards</button>
</body>
</html>

здесь while(currentCard != 'spade') { currentCard = cards [Math.floor(Math.random()*4)]; }

всегда будет давать спейд, если вы хотите случайное, вы можете удалить while и поставить currentCard = cards [Math.floor(Math.random()*4)];

0 голосов
/ 28 февраля 2019

Вы должны установить value, полученный на input.Используйте document.querySelector, чтобы получить элемент input, и, используя .value, установите значение ввода

.

function randomCards() {
  document.querySelector('#a').value = "";
  const cards = ['dimond', 'spade', 'heart', 'club'];
  let currentCard = ''
  while (currentCard != 'spade') {
    currentCard = cards[Math.floor(Math.random() * 4)];
    document.querySelector('#a').value += currentCard +
      " "
  }
}
<form>
  Cards:<br>
  <input type='text' name="Card Slot" id="a">
</form>
<button onclick='randomCards()'>Get Cards</button>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...