Jquery javascript - 带小提琴的链式选择教程

Question

我在创建链式选择时遇到问题，最终通过将多个 SO 解决方案修补在一起找到了解决方案。本着 SO 的精神，我发布了我的最终解决方案。它适用于 jquery 1.10。

为了让大家开心，我还为它添加了 jsfiddle。 =)

最终的 JSFiddle 在这里：http://jsfiddle.net/NNLh2/

演练：

假设您有两个选择框：

<select id="my_alert_type_id" size="2" name="my_alert[type_id]">
    <option value="1">Live</option>
    <option value="2">EOD</option>
</select>
<br>
<br>
<select id="my_alert_category_id" name="myalert[category_id]" size="10">
    <option>select a feed type</option>
</select>

我希望在用户从第一个选择中选择一个选项后更改第二个选择选项。起初我使用了来自 SO 的这个答案：

How do you remove all the options of a select box and then add one option and select it with jQuery?

然后我发现它必须在页面实际完成加载所有内容时运行这个问题：

show/hide div based on select option jquery

但它仍然没有按照我想要的方式工作。我在第一个框中有两个选项，并且代码需要响应每个选择。我需要将它包装到 if/then 块中，然后在选择时运行那段漂亮的代码。

太好了。我是 C#/php/ruby/C 开发人员；我对所有这些 $ 和函数到底了解多少？ Javascript 试图模拟 C 格式，所以我将它包装在一个 if-then 块中，并借助这个问题：

JQuery - Get select value

我能够将第一个选择的值分配给一个变量，然后运行漂亮的 javascript replace-the-options 部分。

还有中提琴！现在我有一个有效的基本链式选择。我可以通过调整附加部分以任何我想要的方式替换它。这是针对 Rails 项目的，所以下一部分是如何动态创建所有这些。但现在我会享受我的杂乱无章的解决方案并继续该项目。

对于使用 rails 的人：rails 和 js 并不真正相互交流，因此如果您想动态创建这些附加选项，请使用 escape_javascript、render 和自定义创建您传递的 url。并且总是通过 json 传递它。还有其他关于 SO 的问题可以讨论它。去查一下；我不能为你做一切。 =P

Answer 1

好吧，我几乎浏览了上面的整个问题和解决方案，所以请随时发表评论和批评。考虑到 jquery 和 JS 不是我的强项，我为自己感到相当自豪。