js实现下拉框选择要显示图片的方法

 这篇文章主要介绍了js实现下拉框选择要显示图片的方法,涉及针对js操作select的技巧,非常具有实用价值,需要的朋友可以参考下

 
 

本文实例讲述了js实现下拉框选择要显示图片的方法。分享给大家供大家参考。具体实现方法如下：

?

1
2
3
4
5
6
7
8
9
10
11
12

<html>
<title>下拉框选择要显示的图片</title>
<body>
<img width=320 height=240 src="images/m01.jpg" name="x1">
<SELECT onChange="document.x1.src=options[selectedIndex].value">
<option value="images/m04.jpg">油菜花开</option>
<option value="images/m03.jpg">往事如茶</option>
<option value="images/m02.jpg">野花绽放</option>
<option value="images/m01.jpg">红叶传情</option>
</SELECT>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

时间： 2024-09-17 03:37:54

js实现下拉框选择要显示图片的方法的相关文章

js实现下拉框选择要显示图片的方法_javascript技巧

本文实例讲述了js实现下拉框选择要显示图片的方法.分享给大家供大家参考.具体实现方法如下: <html> <title>下拉框选择要显示的图片</title> <body> <img width=320 height=240 src="images/m01.jpg" name="x1"> <SELECT onChange="document.x1.src=options[selectedIn

隐藏-Ext 根据下拉框选择不同的值 显示不同的文本框

问题描述 Ext 根据下拉框选择不同的值 显示不同的文本框 Ext 根据下拉框选择不同的值 显示不同的文本框 只显示了文本框没有显示fieldLabel Ext.onReady(function(){ this.username = { id:'usernameId', tabIndex:4, xtype:'textfield', fieldLabel: '密码', cls:'x-upper-text', width:80, name: 'username', maxLength:25, upp

jQuery实现下拉框选择图片功能实例_jquery

本文实例讲述了jQuery实现下拉框选择图片功能.分享给大家供大家参考.具体如下: 让下拉框中显示图片,并可选择对应图片,让select下拉框不仅可显示文字,还可以显示图片内容.为了更生动些,这里还加入了jQuery动画效果,当展开Select列表的时候,图片渐变显示.使用了一个jQ插件:imageselect.js,使用效果的朋友可以自己下载吧. 运行效果截图如下: 具体代码如下: <!DOCTYPE html> <head> <title>支持图片选择的jQuery

JS获取下拉框显示值和判断单选按钮的方法_javascript技巧

本文实例讲述了JS获取下拉框显示值和判断单选按钮的方法.分享给大家供大家参考.具体如下: 1.本人做过很多项目,都需要得到select组件显示的值.下面是我经常用到的方法: Html源码如下: <html><body> <select id="province" name="province" > <option value="1">北京</option> <option valu

基于jQuery的select下拉框选择触发事件实例分析_jquery

本文实例讲述了基于jQuery的select下拉框选择触发事件实现方法.分享给大家供大家参考,具体如下: 我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: <select> <option value="0" onclick="func(0)">选项一</option> <option value="1" onclick="func(1

JS实现下拉框的动态添加(附效果)_javascript技巧

效果展示: 页面初加载时:      选择车类型后:      选择车颜色后:     JS实现下拉框的动态添加,网页代码如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www

JavaScript实现单击下拉框选择直接跳转页面的方法

  本文实例讲述了JavaScript实现单击下拉框选择直接跳转页面的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <script type="text/JavaScript"> <!-- function MM_jumpMenu(targ,selObj,restore){ //v3.0 eval(targ+".location='&quo

Js获取下拉框选定项的值和文本的实现代码

 本篇文章主要是对Js获取下拉框选定项的值和文本的实现代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误!   下面我总结下Firefox和IE下获取下拉框选定项的值和文本:   1. IE和Firefox都支持的方法: 获取文本    代码如下: var obj=document.getElementById('select_template'

下拉框 地图-下拉框选择不同的值，google地图也跟着变动

问题描述 下拉框选择不同的值,google地图也跟着变动 http://www.sanygroup.com/group/zh-cn/service/network.jsp 效果和这个一样