当显示我的隐藏选择表单时，它不会调用javascript函数

我有一个隐藏的select元素，带有对javascript函数的onchange调用

当用户单击我的页面上的按钮时，我运行以下代码并显示我的选择表单：

$("#moreDetails2").show();
$('#moreDetails2').trigger("create");

但是，在显示它之后，它将不会执行其JavaScript函数。我已经测试了它，没有隐藏，它的工作

<div id = \"moreDetails2\">  
                    <select  onchange=\"moreDetails2($userID,'$id')\">

                        <option value=\"0\">More Options</option>
                        <option value=\"1\"> View Taste Profile</option>
                        <option value=\"2\"> Add Taste Tags</option>

                    </select>
                </div>

更多选择
查看味觉档案
添加味觉标签

---

查看chrome中的inspect元素时，我没有发现任何错误。

使用与全局函数名和元素标识符相同的名称将导致chrome、Safari和IE（而不是Firefox）出现问题

尝试将事件处理程序函数名更改为“moretailstwo”或其他名称

---

Chrome、Safari和IE为每个具有“id”值的元素创建全局符号（即，

window

properties）。我怀疑这破坏了“moreDetails2”函数的绑定。

jQuery Mobile不能很好地使用onchange=“…或onclick=“。。。事件绑定，您需要手动执行，如下所示：

$(document).on('pagebeforeshow', '#index', function(){       
    $(document).on('click', '#test-button', function(){     
        $("#moreDetails2").show();
        $("#moreDetails2 select").css('display','block').selectmenu('refresh');
    });    

    $("#moreDetails2 select").on( "change", function(event, ui) {
        moreDetails2('aaaa');
    });    
});

function moreDetails2(text) {
    alert(text);
}

下面是根据您的代码创建的一个工作JSFIDLE示例：