Question

代码

<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 我尝试了几种从选择选项中获取“价值”的方法，但没有工作

Answer 1

只需将<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，还可以在按钮HTML上添加onclick功能：

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

这是一个JSFiddle：

https://jsfiddle.net/xo99zrLe/

获得多个选项的每个值

1 个答案: