Jquery javascript - 链接选择教程与小提琴 [英] Jquery javascript - Chained Select Tutorial with fiddle

查看:130
本文介绍了Jquery javascript - 链接选择教程与小提琴的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个创建链接选择的问题,最终通过一起修补多个SO解决方案找到解决方案。本着SO的精神,我发布了我的最终解决方案。它与jquery 1.10一起使用。

I had an issue creating a chained select, and eventually found the solution by patching several SO solutions together. In the spirit of SO, I'm posting my final solution. It works with jquery 1.10.

为了让大家快乐,我还包括了jsfiddle。 =)

And to make everyone happy, I also included the jsfiddle for it. =)

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

Final JSFiddle is here: http://jsfiddle.net/NNLh2/

演练:

假设你有两个选择框: p>

Assume you have two select boxes:

<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>

我希望在用户从第一个选择中选择一个选项后,第二个选择选项进行更改。起初我使用了这个答案:

I want the second select options to change after the user selects an option from the first select. At first I used this answer from SO:

如何删除选择框的所有选项,然后添加一个选项并选择它与jQuery?

然后我发现,当页面实际上完成加载所有这些问题时,它必须运行:

And then I found out that it had to run when the page was actually done loading everything with this question:

显示/根据选择选项jquery隐藏div

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

But it still didn't work the way I wanted. I had two options in that first box, and the code needed to respond to each selection. I needed to wrap it into a if/then block, and THEN run that nifty bit of code when I had the selection.

Greaaaat。我是C#/ php / ruby​​ / C开发人员我对这些$和功能有什么了解? Javascript尝试模拟C格式,所以我把它包装在一个if-then块中,并在这个问题的帮助下:

Greaaaat. I'm a C#/php/ruby/C developer; what the heck do I know about all those $'s and functions? Javascript tries to emulate C formatting, so I wrapped it in a if-then block, and with the help of this question:

JQuery - 获取选择值

我能够分配首先选择一个变量,然后运行漂亮的javascript替换选项部分。

I was able to assign the value of the first select to a variable, then run the nifty javascript replace-the-options part.

和中提琴!现在我有一个基本的链接选择工作。我可以通过调整附加部分替换任何我想要的。这是一个rails项目,所以下一部分是如何动态创建所有这些。但是现在我可以享受我的kludged解决方案,并得到这个项目。

And viola! Now I have a basic chained select that works. I can replace it any way I want by adjusting the append part. This is for a rails project, so the next part is how to create all this dynamically. But for now I'll enjoy my kludged solution and get on with the project.

对于rails来说,rails和js没有真正的交流,所以如果要动态创建附加选项,请使用escape_javascript,render和custom创建您要传递的URL。总是通过json传递它。还有其他有关SO的问题。去看看吧我不能为你做任何事情= P

For the rails people: rails and js don't really talk to each other, so if you want to create those appended option dynamically, use escape_javascript, render, and custom create the url you're passing. And there's always passing it via json. There are other questions on SO that talk about it. Go look it up; I can't do everything for you. =P

推荐答案

嗯,我几乎走过了上面的整个问题和解决方案,所以随时评论和批评。我为自己考虑jquery感到自豪,而JS不是我的伪造者。

Well, I pretty much walked through the entire problem and solution above, so feel free to comment and critique. I'm rather proud of myself considering jquery and JS aren't my forte.

这篇关于Jquery javascript - 链接选择教程与小提琴的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆