0

我正在尝试使用选择框来显示许多项目。我的选择标签包含是这样写的：

<%= select_tag "number_of_pets", options_for_select(allowed_pets_options, @pet_number_storage), onchange:"show_pet_forms(this.value, #{RecordsHelper::ALLOWED_PETS})" %>

并像这样解析成 HTML：

<select id="number_of_pets" name="number_of_pets" onchange="show_pet_forms(this.value, 4)">
    <option value="1" selected="selected">1 Pet</option>
    <option value="2">2 Pets</option>
    <option value="3">3 Pets</option>
    <option value="4">4 Pets</option>
</select>

在我的 application.html.erb 文件的头部区域中，我有这个 javascript：

<script type="text/javascript">
function show_pet_forms(pets_selected, pets_allowed) {

    for (var i=1;i<=pets_selected;i++)
    { 
        element_id = "pet-" + i;
        document.getElementById(element_id).style.visibility = "visible";
        document.getElementById(element_id).style.display = "block";
    }
    for (var i=(pets_selected+1);i<=pets_allowed;i++)
    {
        element_id = "pet-" + i;
        document.getElementById(element_id).style.visibility = "hidden";
        document.getElementById(element_id).style.display = "none";
    }
}    
</script>

（最初javascript在coffeescript文件中，但我在试图找出问题所在时移动了它。

我试图显示和隐藏的元素是：

<div id="pet-1">
    SOME STUFF HERE
</div>
...
<div id="pet-4">
    SOME STUFF HERE
</div>

不幸的是，当我在选择框中选择一个选项时，我没有看到任何变化，而且我无法确定它是否没有正确触发事件，或者我的 javascript 是否有问题（很可能）。错误可能在哪里？

谢谢！

4

1 回答 1

1

第二个for是不隐藏其他 div。

for (var i=(pets_selected+1);i<=pets_allowed;i++)

在上述情况下，您尝试添加pets_selected + 1将连接而不是添加。

您需要先将其解析为整数，然后添加。

for (var i=(parseInt(pets_selected)+1);i<=pets_allowed;i++)

见小提琴

于 2013-06-06T20:04:05.733 回答