HTML中select标签jq获取选中的option的value及Text内容

HTML中select标签jq获取选中的option的value及Text内容

前言：自己独立开发了一个缴费系统，为了客户端体验效果更好，做的是前后端分离！

当用到select选项框时，区分开支付方式两个不一样到接口

直接上代码
html

<div class="form-group">
    <label>支付方式</label>
    <select class="form-control" id="myselect">
        <option value="1">银行卡</option> <!--给select 的option标签赋值，方便区分-->
        <option value="2">余额</option>
    </select>
</div>

js部分

     var opt=$("#myselect").val();//声明的获取id的值是select的值也就是option标签里的value

     $('#myselect').change(function () {
        if(opt === '1'){
            //当select的选项为1时,执行的js方法
            $('#hxPay').show();
        }else {
            $('#hxPay').hide();
        }
    });



    if(opt == '1'){
            window.location.href='https://mp.csdn.net';//select值选项为1时
        }
        if(opt == '2'){
            {
                $.ajax({
                    url: "{:U('Product/add')}",
                    type: 'post',
                    dataType: 'json',
                    data: data,
                    success: function (res) {
                        if(res.status == 0){
                            $("#message").show().html("余额不足,3秒后前往充值!").fadeOut(3000,function () {
                                window.location.href='/About/add.html'
                            });
                        }else {
                            $("#message").show().html("缴费成功").fadeOut(3000,function () {
                                window.location.href='/About/index.html'
                            });
                        }
                    },
                    error: function () {
                    }
                });
            }
        }