Question

我在这里遇到了一个小小的挑战。我有3个级联下拉列表，category，subcategory，subsubcategory。用户从category列表中选择一个值，然后在subcategory中显示相关值当用户CHANGES显示subcategory上subsubcategory相关值的值时。我的问题是，我想在change列表中触发subcategory事件，而无需用户选择新值！当用户在subsubcategory NOT CATEGORY列表中选择一个值时，我想在SUBCATEGORY中显示相关值！这是代码： -

  <script type="text/javascript">
    $('#category').change(function(){
    var category_id = $(this).val();    
    //alert(category_id);
        $.ajax({
           type:"GET",
           url:"/search_subcat",

           data:{'category_id':category_id},
           dataType: 'json',
           success:function(res){                  
                //console.log(res); 
                $("#subcategory").empty();
                //$("#subcategory").append('<option value="0">Select</option>');

                 $.each(res, function(index, element) {
                $("#subcategory").append('<option value="'+element.id+'">'+element.subcategory+'</option>');
            })

            },error:function(jqXHR, textStatus, errorThrown){
               $("#subcategory").empty();
             }
           });
});
   $('#subcategory').change(function(){
    var subcategory_id = $(this).val();
    var category_id = $('#category').val();    
    //alert(category_id);
        $.ajax({
           type:"GET",
           url:"/search_subsub",

           data:{'category_id':category_id, 'subcategory_id':subcategory_id},
           dataType: 'json',
           success:function(res){                  
                //console.log(res); 
                $("#subsubcategory").empty();
                //$("#subsubcategory").append('<option value="0">Select</option>');
                 $.each(res, function(index, element) {
                $("#subsubcategory").append('<option value="'+element.id+'">'+element.subsubcategory+'</option>');
            })

            },error:function(jqXHR, textStatus, errorThrown){
               $("#subsubcategory").empty();
             }
           });

    });

它工作得很完美，我想要做的只是在没有用户更改其值的情况下触发$('#subcategory').change，我希望在用户选择category值时触发它。感谢

Answer 1

在没有参数的情况下调用change()将触发事件...或使用trigger()

$('#subcategory').change()

或者

$('#subcategory').trigger('change')

演示：

$('#subcategory').on('change', function() {
  console.log('New value is ', this.value)
}).val(2).change()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="subcategory">
  <option></option>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

在Jquery中选择标签更改事件而不受用户干扰？

1 个答案: