Событие OnClick, не работающее в раскрывающемся списке

Question

У меня выпадающее меню, когда я выбираю параметр, он будет извлекать значение из базы данных и будет отображаться в тексте feild. Поэтому я сделал функцию Click. Его работала в Firefox Но не работал в Google Chrome.

HTML:

<select id="classi" name="classi"> 
    <option value="1" onclick="chagePack('<?php echo sha1('month11')?>',1,10);">1 months</option> 
    <option value="2" onclick="chagePack('<?php echo sha1('month23')?>',3,20);">3 months</option> 
    <option value="3" onclick="chagePack('<?php echo sha1('month36')?>',6,30);">6 months</option> 
    </select> 

Javascript:

function chagePack(pack,month,type) 
{ 
alert("test"); 
$.post("change_membership_page", 
{ 
    pack: pack, month: month, type:type 
}, 
function(data, status){ 
    $("[id='replace-month-pack']").html(data); 
    //alert("Data: " + data + "\nStatus: " + status); 
}); 
} 

Answer 1

Это считается плохой практикой для прослушивания события click на элементе select. Вы не можете использовать клавиатуру.

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

HTML:

<select id="classi" name="classi"> 
    <option value="1" data-params="1,1,10">1 months</option> 
    <option value="2" data-params="2,3,20">1 months</option> 
    <option value="3" data-params="3,6,30">1 months</option> 
</select> 

JS:

$("#classi").on('change', function(){ 
    var params = $(this).children(':selected').data('params'); 
    alert(params); 
}); 

Интернет: http://jsfiddle.net/haytzsr8/

Answer 2

Вы пропустили одну единственную цитату ' знак.

Вместо этого

<option value="1" onclick="chagePack('1,1,10);">1 months</option> 

Используйте этот

<option value="1" onclick="chagePack('1,1,10');">1 months</option> 

Ваш общий код должен выглядеть следующим образом

function chagePack(pack,month,type) 
 
{ 
 
alert("test"); 
 
$.post("change_membership_page", 
 
{ 
 
    pack: pack, month: month, type:type 
 
}, 
 
function(data, status){ 
 
    $("[id='replace-month-pack']").html(data); 
 
    //alert("Data: " + data + "\nStatus: " + status); 
 
}); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="classi" name="classi"> 
 
    <option value="1" onclick="chagePack('1,1,10');">1 months</option> 
 
    <option value="2" onclick="chagePack('2,3,20');">1 months</option> 
 
    <option value="3" onclick="chagePack('3,6,30');">1 months</option> 
 
</select>

Answer 3

Вы должны использовать onChange событие вместо onClick.

OnClick не является стандартным событием для SELECT тег.

Answer 4

 Worked 
     <select id="classical" name="classical" > 
     <option value="1" data-params="<?php echo sha1('month11')?>,1,1">1 months</option> 
     <option value="2" data-params="<?php echo sha1('month31')?>,3,2">3 months</option> 
     <option value="3" data-params="<?php echo sha1('month61')?>,6,3">6 months</option> 
     </select> 



    $("#classical").on('change', function(){ 
     var params = $(this).children(':selected').data('params'); 
     var val = params.split(','); 
     chagePack(val[0],val[1],val[2]); 
    }); 

    function chagePack(pack,month,type) 
    { 
     $.post("change_membership_page", 
     { 
      pack: pack, month: month, type:type 
     }, 
     function(data, status){ 
      $("[id='replace-month-pack']").html(data); 
     }); 
    }