Javascript 基于下拉值显示元素数量时出现问题

我以前问过一个问题来解决我的难题，即如何根据下拉值显示元素的数量。例如，如果我选择“2”，将显示2个div元素。如果选择“3”，将显示3个元素

目前，我的页面的设置方式是，当您选择“1”时，将显示元素1。选择“4”时，将显示元素4

这个怎么了？谢谢

---

编辑：更新了html，将

.CommonAttribute

替换为

.modelNumberAll
您尚未在要显示/隐藏的项目上实际使用“CommonAttribute”类。$（'.CommonAttribute'）的查询结果为空

为了确定这一点，我打开了Chrome Devtools，设置了一个断点以在更改事件期间停止，更改了选择框的值，然后在代码编辑器中选择“$（'.CommonAttribute'）”查询，右键单击它并选择“在控制台中评估”。它显示了一个空的结果，事实上，编号的元素没有这个类，就像在JSFIDLE中一样。
我两天前给你的
：lt（）
发生了什么事？我在该页面中没有看到你的javascript…该页面的脚本中有一个javascript错误，其中包含无法工作的代码。Javascript错误将停止执行发生错误的脚本。请在修复此错误后重试。对此我深表歉意！我不敢相信我忽略了这一点-我修复了所有这些，但结果仍然是一样的。
<select class="signupSearchModelTypeSelect" id="selectModelNumber" name="modelsCount" style="display: none;">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
</select>


<div class="signupLabelSelectContainer modelNumberAll modelNumber1">
blablabla
</div>
<div class="signupLabelSelectContainer modelNumberAll modelNumber2">
blablabla
</div>
<div class="signupLabelSelectContainer modelNumberAll modelNumber3">
blablabla
</div>
<div class="signupLabelSelectContainer modelNumberAll modelNumber4">
blablabla
</div>

.....
$(".signupSearchModelTypeSelect").chosen({
            inherit_select_classes: true,
            disable_search: true
        }).change(function(f, g) {
            if ($(this).attr("name") == "modelsCount") {
                //This section controls the dropdown
                $(".modelNumberAll").addClass("hide");
                $(".modelNumber" + $(this).val()).removeClass("hide")
            }
....

$(".signupSearchModelTypeSelect").chosen({
    inherit_select_classes: true,
    disable_search: true
}).change(function(f, g) {
    if ($(this).attr("name") == "modelsCount") {

    //This section controls the dropdown
    var number = $(this).val();
    $('.CommonAttribute').hide().slice( 0, number ).show();
});