HTML Select 标签选择后触发jQuery事件代码实例

因为很多客户不知道如何驾车来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点。

实现起来并不难,但由于公司有很多办事处,所以需要设计一个选单,在用户选择相应办事处后自动加载相关的地图,于是我做了以下页面:

(小弟不才,如代码有冗余或您有更好的写法还请各位指正,谢谢!底部有贴出原代码!)

 

那么如何写Select中的触发事件呢?

有以下几种方法:

方法一,纯JS代码:

 

方法二,使用jQuery代码:(这个是网上找的实例,原理是一样的,这个是先获取option的val值,然后在#thediv中显示该值,思路是一致的,稍微改一下代码即可做成加载地图的效果)

 

以下为我编写的源代码,请在移动端预览效果。(供参考,转载请注明原文链接):

 

以上代码主要记录JQuery事件代码,调用地图部分为旧内容,个人使用的页面实际URL已更新为API的地图标注方式。(推荐!)

示例效果:

Demo

 

腾讯地图API使用说明:

http://lbs.qq.com/tool/component-marker.html

http://lbs.qq.com/webservice_v1/guide-search.html

 

By:Colin

原文链接:,转发请注明来源!

发表评论