如何在Ajax success函数中访问外部变量及关联下拉框值

嘿，我来帮你搞定这两个问题：

问题1：在Ajax success函数中访问外部的selected_color和selected_c_name #

其实你完全没必要通过Ajax的data参数传递这两个变量——得益于JavaScript的闭包特性，你的success回调函数本身就可以直接访问它所在的外部函数（也就是$('#colorsData').on('change', ...)的回调）里定义的selected_color和selected_c_name变量。

你之前尝试用data传递是绕了远路，直接在success里使用这两个变量就行。我帮你调整一下代码里的html生成部分：

// 在success函数内部直接调用selected_color和selected_c_name
html = '<div class="row size-row" style="margin-top: 5px;"><label class="col-sm-2 control-label"></label><div class="col-md-2 col-lg-2"><select class="form-control" name="color[]" id="sizesData"><option value="'+selected_color+'">'+selected_c_name+'</option></select></div><div class="col-md-1 col-lg-1"><select class="form-control" name="size[]" id="sizesData'+num+'">';

这样就能直接把选中的颜色值和名称插入到生成的HTML结构里，完全不需要额外做参数传递的操作。

问题2：从demosize0获取colorsData0的选中值 #

假设colorsData0是页面上对应下拉框的ID，你可以直接通过jQuery选择器获取它的选中值。如果是要在demosize0的change事件触发时获取，直接在事件回调里写：

$('#demosize0').on('change', function(){
    // 获取colorsData0的选中值
    var selectedColorVal = $('#colorsData0').val();
    // 如果需要获取选中项的文本内容，用下面这行：
    var selectedColorText = $('#colorsData0').find(':selected').text();
    
    // 接下来就可以用selectedColorVal和selectedColorText做你需要的逻辑处理了
});

如果colorsData0是动态生成的元素（不过你提到页面上已经存在demosize0下拉框，那colorsData0大概率也是预先存在的），要是遇到动态生成的情况，就用事件委托的方式绑定事件：

$(document).on('change', '#demosize0', function(){
    var selectedColorVal = $('#colorsData0').val();
    var selectedColorText = $('#colorsData0').find(':selected').text();
    // ...后续业务逻辑
});

这样就能轻松拿到colorsData0的选中值啦。

内容的提问来源于stack exchange，提问作者Gaurav