Wie schließe ich das Bootstrap-Modal (5.2) mit Javascript?

Question

Für ein Schulprojekt habe ich mit Bootstrap in HTML ein Modal erstellt, in dem es eine Eingabeaufforderung gibt, die ich über Javascript überprüfen muss. Wie kann ich das Modal über Javascript schließen, damit ich die Änderungen einfach speichern kann, wenn die Eingabeaufforderung erscheint? ist gültig. Wenn nicht, werde ich eine Ausnahme auslösen? Kleiner Hinweis (bitte verwenden Sie kein jQuery, ich habe einen ähnlichen Thread gesehen, der diese Bibliothek als Antwort verwendet und die Zuweisung nicht zulässt)

Das ist mein HTML-Code:

<div class="modal fade" id="bidModal" tabindex="-1" aria-labelledby="bidModal" aria-hidden="true">
        <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h1 class="modal-title fs-5" id="bidModalLabel">Bid amount</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <p class="text" id="prompted">How much do you want to bet?</p>
                <div class="input-group mb-2">
                    <input id="bAmount" type="text" class="form-control text" aria-label="Amount of bet">
                    <span class="input-group-text">€</span>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cancel bid</button>
                <button type="button" onClick="bid()" class="btn btn-success">Save bid</button>
            </div>
        </div>
        </div>
    </div>

Das ist mein JavaScript-Code:

function bid(){
    let valueOfBid = document.getElementById("bAmount").value;
    if(isNaN(valueOfBid)){
        //Cancel the prompt
    }

    players[realPlayer].bet=valueOfBid;
    changeButtonState(false);
    theTimer();
}

Answer 1

您可以将其添加到应关闭模式的元素中...

data-bs-dismiss="modal"

以下模式根据搜索词和用户匹配生成链接列表。

当他们单击其中一个路由器链接时，由于该行，它将关闭模式

{{ user }}

上面的代码是在模态中生成的 -> 这是整个事情

    

      

        

          

            
Find User
            
          
          

            Steem Username:
            
          
          

          

            

              {{ user }}
            
          
          

            
              Close
            
          
        
      
    
  

Answer 2

请尝试这样。我建议您在将我的代码添加到代码库之前将 isNaN(valueOfBid) 更改为 valueOfBid == "" 。

function bid(){
    let valueOfBid = document.getElementById("bAmount").value;
    if(valueOfBid == ""){
      alert(1)
        //Cancel the prompt
      var myModalEl = document.getElementById('bidModal');
var modal = bootstrap.Modal.getInstance(myModalEl)
modal.hide();
    }

    // players[realPlayer].bet=valueOfBid;
    // changeButtonState(false);
}