获得多一种选择
问题描述：
代码everyvalue获得多一种选择
<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";
}
我想使 “值” 时，用户点击按钮 “立即订购” 到链接WhatsApp的API像https://api.whatsapp.com/send?phone=numberphone&text=(value)
例如：https://api.whatsapp.com/send?phone=numberphone&text=Full%20Address%20:%20Sir%20Matt%20Busby%20Way%20Shipping%20:%20DHL%20Payment%20:%20PayPal
我已经尝试了几种方法来从选择选项获得“价值”，但没有工作
答
只储存<select>元素的值的变量，然后引用这些变量在URL
使用jQuery：
$('#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');
});
本地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');
}
对于原生JS还加onclick function to your button HTML：
<button id="abc" type="button" href="" onclick="sendText()">ORDER NOW!</button>
这里有一个的jsfiddle：
您可以将事件处理程序不分配给这样的元素的集合。您必须遍历sel并将处理程序分别应用于每个选择。 – James