Question

根据所选选项，隐藏并显示div。长话短说。

1级和2级 - 隐藏名为“custompanel”的div
custom - 显示名为“custompanel”的div

正常工作 JSFIDDLE 但我想问题就在于CDN。无法弄清楚。需要帮助。

HTML
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<title>Password Generator</title>
<!-- Latest compiled and minified CSS -->

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<link rel="stylesheet" type="text/css" href="screen.css" media="screen, projection" />
<script>
$(document).ready(function() {
    $('#generator-mixcase').on('change',function(){
        if($(this).val() == 'custom') {
            $('.custompanel').show();
        } else {
            $('.custompanel').hide();
        }
    });
});
</script>
</head>

问题：当我选择自定义时，它不会显示div。请查看下面的图片。

异常在jquery CDN上显示错误。我的jquery CDN错了吗？

"Error: Failed to execute 'querySelectorAll' on 'Element': '*,:x' is not a   valid selector.↵    
at Error (native)↵    at https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:10694↵    
at ia (https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:7550)↵   
at fa.setDocument (https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:10432)↵    
at https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:22250↵    
at https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:22970↵    
at https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:207↵    
at https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js:2:212"

Answer 1

前段时间我有这个错误，请尝试删除bootstrap include。

Answer 2

试试这个：

jQuery(document).ready(function($)

而不是

$(document).ready(function()

它有效，经过验证！

在加载依赖组件之前，必须加载jQuery。

隐藏和显示jquery - 不工作但小提琴工作正常

2 个答案: