我找了很多，现在我真的不知道该怎么办。我的问题是我在 HTML5 文档中有一个选择控件，如下所示：
<label for="efectosId" >Elija un efecto</label>
<select id="efectosId" >
<option value="THRESHOLD" selected>Limite</option>
<option value="GRAY">Escala de grises</option>
<option value="OPAQUE">Opacidad</option>
<option value="INVERT">Invertir</option>
<option value="POSTERIZE">Posterizar</option>
<option value="DILATE">Desenfoque Dilatar</option>
<option value="BLUR">Desenfoque blur</option>
<option value="ERODE">Desenfoque Erosionar</option>
</select>
此外，在 JavaScript 文件中，我有以下代码：
$(document).ready(function(){
$("#efectosId").on("change",function(){
alert("hola mundo");
});
});
当我在加载 jQuery 库的单个文档中尝试代码时，它运行良好，但是当我需要在我按顺序加载 jQuery 库、jQuery 移动库和 jQuery ui 库的文档中使用它时，它不会工作：
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="./bgrins-spectrum-98454b5/spectrum.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>
拜托，我可以得到任何支持吗？？这让我发疯了谢谢！
好的，解决方案是，当我使用 jquery mobile、jquery ui 和 bootstrap 库添加选择时，选择控件会更改我的 HTML 的结构：
<div class="ui-selectmenu-menu ui-front ui-selectmenu-open" style="top: 105px; left: 769.5px;"><ul aria-hidden="false" aria-labelledby="efectosId-button" id="efectosId-menu" role="listbox" tabindex="0" class="ui-menu ui-corner-bottom ui-widget ui-widget-content" aria-activedescendant="ui-id-7" aria-disabled="false" style="width: 196px;"><li class="ui-menu-item"><div id="ui-id-2" tabindex="-1" role="option" class="ui-menu-item-wrapper">Limite</div></li><li class="ui-menu-item"><div id="ui-id-3" tabindex="-1" role="option" class="ui-menu-item-wrapper">Escala de grises</div></li><li class="ui-menu-item"><div id="ui-id-4" tabindex="-1" role="option" class="ui-menu-item-wrapper">Opacidad</div></li><li class="ui-menu-item"><div id="ui-id-5" tabindex="-1" role="option" class="ui-menu-item-wrapper">Invertir</div></li><li class="ui-menu-item"><div id="ui-id-6" tabindex="-1" role="option" class="ui-menu-item-wrapper">Posterizar</div></li><li class="ui-menu-item"><div id="ui-id-7" tabindex="-1" role="option" class="ui-menu-item-wrapper ui-state-active">Desenfoque Dilatar</div></li><li class="ui-menu-item"><div id="ui-id-8" tabindex="-1" role="option" class="ui-menu-item-wrapper">Desenfoque blur</div></li><li class="ui-menu-item"><div id="ui-id-9" tabindex="-1" role="option" class="ui-menu-item-wrapper">Desenfoque Erosionar</div></li></ul></div>
所以当我从 jquery 调用它时，我必须这样调用它：
$("#efectosId-menu").on("click",function(e){
console.log(e.target.textContent);
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句