OnClick 事件在下拉选项中不起作用答案

【问题标题】：OnClick event not working in dropdown optionOnClick 事件在下拉选项中不起作用
【发布时间】：2015-03-11 07:49:18
【问题描述】：

我有下拉菜单，当我选择选项时，它将从数据库中检索值并显示在文本字段中。所以我做了点击功能。它在 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);
 }); 
}

【问题讨论】：

在选择时使用 onchange
你可以使用onchange事件
Onchange 也不起作用
查看@Moksh shah 给出的答案
检查我的答案，你错过了单引号' 标记。

标签： jquery html codeigniter

【解决方案1】：

在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/

【讨论】：

非常感谢@skip405 我得到了结果

【解决方案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>

【讨论】：

这里只有我错过了逗号。
我的实际代码是
你的php代码应该是：<option value="1" onclick="chagePack('<?php echo sha1("month11"); ?>',1,10)">1 months</option>

【解决方案3】：

您应该使用onChange 事件而不是onClick。

OnClick 不是SELECT 标签的标准事件。

【讨论】：

您是否在控制台中遇到任何错误？你在网络选项卡中检查了ajax吗？你是怎么知道这行不通的？
谢谢@apul。我得到了结果

【解决方案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); 
       });  
    }

【讨论】：