변경이 개 필드는 자동으로 서로

Question

에 따라 나는 selectize.js를 사용하고 난 2 개 선택 필드가 ; 두 번째 값이 변경 (또는 선택)되면 첫 번째 값을 변경하십시오.

$("#field1").change(function() { 
    var d = 'value-field2' 
    var $select_field2 = $("#id_field2").selectize(); 
    var selectize_field2 = $select_field2[0].selectize; 
    selectize_field2.setValue(d); 
    }); 

    $("#field2").change(function() { 
     var d = 'value-field1' 
     var $select_field1 = $("#id_field1").selectize(); 
     var selectize_field1 = $select_field1[0].selectize; 
     selectize_field1.setValue(d); 
    }); 
    }); 

을하지만, 여기에 서로를 변경 때문에, 서로를 호출,이 두 기능의 무한한 호출로 이동합니다

나는이 같은 change 기능을 사용하고 있었다. change() 대신 mouseover() 또는 click()을 사용해 보았지만 정상적으로 작동하지 않았습니다.

아이디어가 있으십니까?

Answer 1

자바 스크립트가 사용자 대신 값을 변경하는 경우 식별 할 수있는 변수가 필요합니다. 당신이 뭔가를 사용할 수 있습니다

var programmaticallyChanging = false; 
 

 
$("#field1").change(function() { 
 
    if (!programmaticallyChanging) { 
 
     var d = 'value-field2' 
 
     var $select_field2 = $("#id_field2").selectize(); 
 
     var selectize_field2 = $select_field2[0].selectize; 
 
     programmaticallyChanging = true; 
 
     selectize_field2.setValue(d); 
 
     programmaticallyChanging = false; 
 
    } 
 
}); 
 

 
$("#field2").change(function() { 
 
    if (!programmaticallyChanging) { 
 
     var d = 'value-field1' 
 
     var $select_field1 = $("#id_field1").selectize(); 
 
     var selectize_field1 = $select_field1[0].selectize; 
 
     programmaticallyChanging = true; 
 
     selectize_field1.setValue(d); 
 
     programmaticallyChanging = false 
 
    } 
 
});

가능한 경우는, var에의 programmaticallyChanging을 넣어 = 거짓; 창에 노출되지 않도록 일부 기능에 추가하십시오.