erhalten everyvalue von mehr als eine Option

Question

-Code

<div class="form-group"> 
     <label class="sr-only">Address : </label> 
     <input type="text" id="address" name="fulladdress" class="form-control" placeholder="Full Address" required="required" autocomplete="off"> 
    </div> 
    <div class="form-group"> 
     <label>Shipping : </label> 
    <select class="form-control" id="shipping" name="shipping"> 
     <option value=""></option> 
     <option value="DHL">DHL</option> 
     <option value="HDL">HDL</option> 
    </select> 
     <i class="fa fa-chevron-down" style="right: 10px;bottom: 10px;position: absolute"></i> 
    </div> 
    <div class="form-group"> 
     <label>Payment : </label> 
    <select class="form-control" id="bank" name="payment"> 
     <option value=""></option> 
     <option value="btc">Bitcoin</option> 
     <option value="pp">PayPal</option> 
    </select> 
     <i class="fa fa-chevron-down" style="right: 10px;bottom: 10px;position: absolute"></i> 
    </div> 
<div class="btn"> 
    <button id="abc" type="button" href="">ORDER NOW!</button> 
</div> 

JS

var sel = document.getElementsByClassName("form-group"); 
sel.onchange = function() { 
    document.getElementById("abc").href = "https://api.whatsapp.com/send?phone=6281911090008&text=" + this.value + ".html"; 
} 

ich will "Wert", wenn Benutzer klicken Sie Schaltfläche "Jetzt bestellen" in einen Link whatsapp API machen wie https://api.whatsapp.com/send?phone=numberphone&text=(value)

Beispiel: https://api.whatsapp.com/send?phone=numberphone&text=Full%20Address%20:%20Sir%20Matt%20Busby%20Way%20Shipping%20:%20DHL%20Payment%20:%20PayPal
Ich habe verschiedene Möglichkeiten ausprobiert, um "Wert" von der Option zu erhalten, aber nicht funktioniert

Answer 1

speichern Sie die Werte von <select> Elemente in Variablen, dann diese Variablen in der URL

Mit jQuery Referenz:

$('#abc').click(function() { 
    var adr = document.getElementById('address').value; 
    var option1 = document.getElementById('shipping').value; 
    var option2 = document.getElementById('bank').value; 
    window.open('https://api.whatsapp.com/send?phone=numberphone&text=Address%3A%20' + adr + '%0AShipping%3A%20' + option1 + '%0ABank%3A%20' + option2 + '%2E'); 
}); 

Mutter JavaScript:

var sendText = function() { 
    var adr = document.getElementById('address').value; 
    var option1 = document.getElementById('shipping').value; 
    var option2 = document.getElementById('bank').value; 
    window.open('https://api.whatsapp.com/send?phone=numberphone&text=Address%3A%20' + adr + '%0AShipping%3A%20' + option1 + '%0ABank%3A%20' + option2 + '%2E'); 
} 

für native JS auch hinzufügen onclick Funktion zu Ihrer Taste HTML:

<button id="abc" type="button" href="" onclick="sendText()">ORDER NOW!</button> 

Hier

ist ein JSFiddle:

https://jsfiddle.net/xo99zrLe/