Javascript 选择2自动触发事件更改

Javascript 选择2自动触发事件更改,javascript,jquery,events,jquery-select2,Javascript,Jquery,Events,Jquery Select2,我有4个选择框,当我更改第一个选择框时,我会执行一些操作,比如清空、追加和设置下一个选择框的新值 因为我使用select2,所以可以使用$.select2('val','value')进行设置 仅此命令就触发另一个select-and-do级联更改上的更改事件 请注意,.empty()和append()不会触发(我喜欢这样),即使是.val()也不应该触发它,但是当您使用select2时,您不能使用它访问新的val 代码如下: function anidado(selectorOrigen,se

我有4个选择框,当我更改第一个选择框时,我会执行一些操作,比如清空、追加和设置下一个选择框的新值

因为我使用select2,所以可以使用$.select2('val','value')进行设置

仅此命令就触发另一个select-and-do级联更改上的更改事件

请注意,.empty()和append()不会触发(我喜欢这样),即使是.val()也不应该触发它,但是当您使用select2时,您不能使用它访问新的val

代码如下:

function anidado(selectorOrigen,selectorDestino) {
  id = selectorOrigen;
  alert(id);
  destino = "#"+selectorDestino;
  valor = $('#'+id).find(":selected").val();
  $.ajax({
    method: "GET",
    url: "blanco2.php",
    data: { select: id, valor: valor }
  })
  .done(function( msg ) {
      obj = $.parseJSON( msg );
      if (obj.length>0) {
        $(destino).empty().append('<option value="x">Select an ---</option>').select2("val", "x");
        $.each(obj,function(index) {
          valor = obj[index].codigo;
          texto = obj[index].descripcion;
          $(destino).append('<option value=' + valor + '>' + texto + '</option>');
          $(destino).prop("readonly",false);

        });
      } else {
        $(destino).empty().append('<option value=""></option>').select2("val", "");
      }

  });
  return false;
}

$( "select" ).change(function() {
  selectorOrigen = this.id;
  if (selectorOrigen === 'pais') {
    selectorDestino = 'ua';
  } else if (selectorOrigen === 'ua') {
    selectorDestino = 'unidad';
  } else if (selectorOrigen === 'unidad') {
    selectorDestino = 'rol';
  } else if (selectorOrigen === 'rol') {
    selectorDestino = 'categoria';
  } else { return false; }
  anidado(selectorOrigen,selectorDestino);
});

我只需要在不触发更改事件的情况下设置新选择的选项。使用select2插件时,任何.select2(“val”、“x”)的替代方法?

select2 4.0要求在更改值时调用基础元素的标准.val()属性。有关详细信息,请参见位于的select 4.0发布的底部

要选择应使用的值,请执行以下操作:

//Select value without triggering change event
$(destino).val('x');

//Select value and trigger change event
$(destino).val("x").trigger("change")
请注意,由于附加选项的方式,您必须首先重新初始化select2,以确保选中该值。i、 e

//Re-initialize and set value without triggering change event
$(destino).select2();
$(destino).val('x');

请参阅下面的提琴以了解工作示例。

而不必每次都触发('change')

设定值:

$('#select').val(value);
最后再次初始化选择2:

$('#select').select2();

我使用的是select2 4版本,您的解决方案不起作用。@Kamlesh上面的JSFIDLE使用的是4.0.0版本,看起来仍然正常工作。您所面临的问题的更多细节需要进一步调查,也许您可以针对您所看到的问题提出一个新问题?如果您使用的是最新版本的4.0.0以上版本,则在回答此问题后的几年内可能发生了变化,Wolfgang的上述评论似乎表明了这些变化。进一步查看Select2的最新版本(4.0.6-rc.0),此解决方案似乎仍能正常运行,使用此版本更新的fiddle可在上找到。如果不重新初始化select2,控制选项的编程方法似乎无法提供更好的清除选项的方法。
$('#select').select2();