Question

0

164

Views

When clicking span element, modal doesn't close

I'm creating two modals. One for buying, and the other for selling. However, when I click on the span in the modal which is supposed to close it, the modal isn't closed. Here's the code:

var buyModal = document.getElementById("buyModal");
var sellModal = document.getElementById("sellModal");

function buy() {
  buyModal.style.display = "block";
}

function sell() {
  sellModal.style.display = "block";
}

function close() {
  buyModal.style.display = "none";
  sellModal.style.display = "none";
}

<button id="buyButton" onclick="buy()">Buy a Currency Pair</button>
<button id="sellButton" onclick="sell()">Sell a Currency Pair</button>
<div id="buyModal" class="modal">
  <div class="modal-content">
    <button class="close" onclick="close()">&times;</button>
    <p>Buy</p>
  </div>
</div>
<div id="sellModal" class="modal">
  <div class="modal-content">
    <button class="close" onclick="close()">&times;</button>
    <p>Sell</p>
  </div>
</div>
</div>

Does anybody know why it doesn't work?

about 4 years ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Accepted Answer · 2022-07-11T07:52:53.134Z

Close is a reserved JavaScript word and the browser refuses to call it in an event.

You must choose a new name (for example closeDiv):

var buyModal = document.getElementById("buyModal");
var sellModal = document.getElementById("sellModal");

function buy() {
  buyModal.style.display = "block";
}

function sell() {
  sellModal.style.display = "block";
}

function closeDiv() {
  buyModal.style.display = "none";
  sellModal.style.display = "none";
}

<button id="buyButton" onclick="buy()">Buy a Currency Pair</button>
<button id="sellButton" onclick="sell()">Sell a Currency Pair</button>
<div id="buyModal" class="modal">
  <div class="modal-content">
    <button class="close" onclick="closeDiv()">&times;</button>
    <p>Buy</p>
  </div>
</div>
<div id="sellModal" class="modal">
  <div class="modal-content">
    <button class="close" onclick="closeDiv()">&times;</button>
    <p>Sell</p>
  </div>
</div>

0

164

When clicking span element, modal doesn't close

1 answers

0

Find remote jobs

Andres GPT