Question

我有以下动态下拉选择标记：

<select name="order_accept" class="select_class order_accept"> 

<option value=''>Choose Option</option>

<option data-toggle="modal" data-target="#myModal" value="0" data-poid="<?php echo $po_id; ?>" <?php if($order_status
 == 0) echo 'selected = "selected"'; ?>>In Process</option>

<option data-toggle="modal" data-target="#myModal" value="2" data-poid="<?php echo $po_id; ?>" <?php if($order_status
 == 2) echo 'selected = "selected"'; ?>><b>Yes, Completed</b></option>

<option data-toggle="modal" data-target="#myModal" value="3" data-poid="<?php echo $po_id; ?>" <?php if($order_status
 == 3) echo 'selected = "selected"'; ?>>Cancel Order</option>

</select>

现在为例如它显示这些选择选项4次。

我想用选定的data-poid值调用ajax。所以我正在使用以下jQuery：

<script type="text/javascript">
$('.order_accept').on('change', function() {
    $('#myModal').modal('show');
});
    $(document).ready(function(){          
        $("#yes").click(function(event) {            
            event.preventDefault();
            $('.order_accept_msg').show();
            var poid = $('.order_accept option:selected').data('poid');                        
            alert(poid);
            var oid = $('.order_accept').val();            

            var token = <?php echo "'".generate_Form_Token('order_accept')."';"; ?>
            $.ajax({
                url : <?php echo "'".SITE_URL."'"; ?> + 'order-accept',
                type : 'POST',
                dataType : 'html',
                data : {
                    'poid'  : poid,
                    'oid'   : oid,
                    '_token' : token,
                },     
                beforeSend : function () {
                    $('#yes').prop('disabled', true);                    
                },        
                success : function (result) {
                    $('.order_accept_msg').html(result);
                    $('.order_accept_msg').show(result);
                    setTimeout(function(){
                        $('#no').trigger("click");    
                        $('#yes').prop('disabled',  false);                        
                        $('.order_accept_msg').hide();
                    }, 3000);
                }   
            });               
        });
    });
</script>

现在，如果我选择第一个下拉选择选项，那么它将获得正确的data-poid值，然后如果选择另一个下拉选择选项，那么它将获得第一个data-poid值！

我希望获得当前选定的data-poid值！

更新：

每个下拉选择选项如下所示：

Answer 1

使用类选择器'.order_accept option:selected'将始终返回第一次出现，因此您必须使用全局变量来存储当前选择：

$(document).ready(function(){
    var current_select;

    $('.order_accept').on('change', function() {
        $('#myModal').modal('show');
        current_select = $(this);
    });
    $(document).ready(function(){          
        $("#yes").click(function(event) {            
            ...

            var poid = $('option:selected',current_select).data('poid');                        
            alert(poid);
        })
    })
})

希望这有帮助。

如何从动态下拉选项中获取当前选定的选项值？

1 个答案: