2016-02-04 5 views
0

Я попытался создать несколько выпадающий здесь является HTML, JS кодМногократное падение вниз не работает в Jquery

<div class="meaaow"> 
<select style="margin-top:10px;width: 90%;margin-left:5px;" name="3223|887" id="3223" class="pp ProjectType_1" required="" pattern="[^a-zA-Z0-9]"> 
    <option value="0" selected="">Requirements</option> 
    <option value="Services">Services</option> 
    <option value="Products" selected="">Products</option> 
</select> 

<select style="margin-bottom:10px;width: 90%;margin-left:5px;" name="3224|888" id="3224" class="qq SubProjectType_1" required="" pattern="[^a-zA-Z0-9]"> 
    <option value="">Select Category</option> 
</select> 

<select style="margin-bottom:10px;width: 90%;margin-left:5px;" name="3387|947" id="3387" class="SubsubProjectType_1" required="" pattern="[^a-zA-Z0-9]"> 
    <option value="0">Select Sub Category</option> 
</select> 
</div> 

JS

Полная Js по ссылке

FIDDLELINK

Так что я пытаюсь сделать это

$('.pp').change(function() { 
    var classNamex = $(this).attr('class'); 
    var pTypeBufr = classNamex.split(' '); 
    var ptype = pTypeBufr[1].split('_'); 
    var OptIndex = $('option:selected', $(this)).index(); 
    var optionx = "<option value=''>Select Category</option>"; 


    //alert(OptIndex); 
    if(OptIndex !=4) 
    { 
     var SubProject_arr = s_a[OptIndex].split("|"); 
     for (var i = 0; i < SubProject_arr.length; i++) { 

      optionx += "<option value='" + SubProject_arr[i] + "' >" + SubProject_arr[i] + "</option>"; 
     } 
    } 
    if(OptIndex ==1) 
    $('.SubProjectType_'+ptype[1]).removeClass('qq').addClass('uu').html(optionx); 
    if(OptIndex ==2) 
    $('.SubProjectType_'+ptype[1]).removeClass('uu').addClass('qq').html(optionx); 
}); 

и для двух различных классов У меня есть две функции, как этот

$('.qq').change(function() { 
     var classNamex = $(this).attr('class'); 
     var pTypeBufr = classNamex.split(' '); 
     var ptype = pTypeBufr[1].split('_'); 
     var OptIndex = $('option:selected', $(this)).index(); 
     var optionx = "<option value=''>Select Sub Category</option>"; 


     alert('sssss'); 
     if(OptIndex ==2) 
     { 
      var SubProject_arr = t_a[OptIndex].split("|"); 
      for (var i = 0; i < SubProject_arr.length; i++) { 

       optionx += "<option value='" + SubProject_arr[i] + "' >" + SubProject_arr[i] + "</option>"; 
      } 
     } 
     // alert('.SubProjectType_'+ptype[1]); 
     $('.SubsubProjectType_'+ptype[1]).html(optionx); 
    }); 

и для класса .uu

$('.uu').change(function() { 

    var classNamex = $(this).attr('class'); 
    var pTypeBufr = classNamex.split(' '); 
    var ptype = pTypeBufr[1].split('_'); 
    var OptIndex = $('option:selected', $(this)).index(); 
    var optionx = "<option value=''>Select Sub Category</option>"; 


    alert('im inside uu'); 

     var SubProject_arr = u_a[OptIndex].split("|"); 
     for (var i = 0; i < SubProject_arr.length; i++) { 

      optionx += "<option value='" + SubProject_arr[i] + "' >" + SubProject_arr[i] + "</option>"; 
     } 

    // alert('.SubProjectType_'+ptype[1]); 
    $('.SubsubProjectType_'+ptype[1]).html(optionx); 
}); 

поэтому в основном я обновляя имя класса 2-го падения вниз, но каждый раз, когда я использую 2-ю выпадающую всегда функцию, связанную с .qq классом, только стрельба

Пожалуйста, помогите мне

+0

вы могли бы быть яснее объяснить, что вы пытаетесь сделать? –

+0

Какая ошибка? Я просто просматриваю пример скрипки, но кажется, что он работает –

+0

@ RyanLittle Я пытаюсь обновить 3-ую выпадающую версию на основе значения 2-го падения, поэтому, когда я выбираю Product, Services, я обновляю класс 2-го падения вниз qq или uu, И у меня есть две разные функции для обоих классов, которые будут обновлять 3-ую выпадающую таблицу с использованием двух разных массивов, . Моя проблема связана только с функцией qq class, работающей ботом, с классом uu – Vikram

ответ

0

Я не могу найти класс uu в оригинале HTML, и я вижу, что вы динамически переключаете класс uu и qq.

Использование событий делегации для проведения мероприятий по динамическому содержания:

 $(document).on('change', '.pp', function() { ..... 
    $(document).on('change', '.qq', function() { ..... 
    $(document).on('change', '.uu', function() { ..... 
+0

Я думаю, что это то, что я искал. Извините, мне было непонятно с моим объяснением, я попробую это и приму свой ответ. – Vikram

+0

Можете ли вы обновить мою скрипку и посмотреть, работает ли она – Vikram

Смежные вопросы