导航:首页 > 编程语言 > js下拉onchange

js下拉onchange

发布时间:2021-03-05 14:03:51

『壹』 javascript中select的onchange事件获取当前选项的值

当前值是:

<select onchange="alert(this.value);">
<option value="test1">test1</option>
<option value="test2">test2</option>
</select>

『贰』 怎么样用js通过onchange用下拉获取一张图片

不太明白你的意思,我试着理解回答。内
例如:
<img id="img1" src="" />
<select onchange="document.getElementById('img1').src=this.value">
<option value="1.jpg">第一个容图片</option>
</select>

『叁』 怎么用js中的onchange中的下拉获取一个图片

嗯,我是这样理解你的意思的,也不知道对不对,就是当下拉菜单发生变化的时候,根据这个下拉菜单所选择的值,去获取对应的图片。

我这是我写的DEMO,你可以仿着再改造一下:

HTML:

<!DOCTYPEhtml>
<html>

<head>
<title>Test4</title>
<metahttp-equiv="Content-type"content="text/html;charset=utf-8"/>
</head>

<body>
<!--onchange事件,调用函数,传入的this就是select这个对象本身-->
<!--传入this,我们就可以直接对其进行操作和访问了-->
<!--另外,option的value我这里设置成了图片的路径,这样当选择发生变化时,就知道图片的src,我就可以添加图片了-->
<selectonchange="fSel(this)">
<optionvalue='../picture/01.jpg'>西瓜</option>
<optionvalue='../picture/02.jpg'>哈密瓜</option>
<optionvalue='../picture/03.jpg'>水蜜桃</option>
</select>
</body>
<scripttype="text/javascript">

functionfSel(obj){
varsrc=obj.value;//获取下拉菜单的选项值
varimg=document.createElement('img');//然后我就创建一个图片对象
img.src=src;//并传给图片对象src,这个图片就有值了,就可以去引用图片路径了
document.body.appendChild(img);//然后将其添加到网页中
//当然,你可以根据你的思路做其它动作,或者是这样,下拉菜单中的option的value值你也不必设成图片的src,可以设置成1、2、3、4,然后得到这个值后,再去选择对应的图片,比如说,有一张图片ID=2,那么,当下拉菜单的值为2时,我就去获取类似“../picture/”+ID+“.jpg”这样的一个字符串,得到图片的src,再去获取或是设置网页上的图片src。这样就实现你的目的了
}

</script>
</html>

『肆』 关于js的onchange方法。

javascript onchange()事件:javascript onchange()事件一般用于用户表单中,例如:当文本框内容发生改变时触发的事件,或者下拉列表框内容发生改变时触发的事件等。

示例分享:onchange()事件,用户输入时,将小写字母转换为大写。

此处用到了javascript中的一个方法 toUpperCase(); //将小写母转换为大写字母。

<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title>用户表单验证</title>
<script>
functionchangeValue(){
varuserName=document.getElementById("userName");//通过Id获得对象userName;

userName.value=userName.value.toUpperCase();//将对象的值进行大小写的转换赋值给当前对象的值;

}
</script>
</head>
<body>
<formname="myform"method="POST"action="register.php"onsubmit="returncheckForm();">
userName:<inputtype="text"name="userName"value=""id="userName"onchange="changeValue();"/><br/>
<inputtype="submit"name=""value="用户注册"/>
</form>
</body>
</html>

『伍』 怎样用js设置select下拉框的当前值是onchange后获得的值

你直接在onchange事件里引入其他方法就可以啊内
<select .... onchange="a();" />
<script>
function a(){
//逻辑容
....
b();
}
function b(){
//逻辑
....
}
</script>

『陆』 下拉框onchange

<form name="frm" method="post">
<select name="aa" onChange="oc(this.options[this.selectedIndex].value);">
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
</select>
</form>
<script>
function oc(v){
alert(v);
alert(document.frm.aa.options.selectedIndex); //当前选择项的索引值,从0开始递增,没选中专时为-1。属
}
</script>

『柒』 select中onchange的用法

用法:onchange 事件会在域的内容改变时发生。

onchange="SomeJavaScriptCode"

onChange事件只有在值改变时才可触发,所以必须在每一次选择时(尤其第一次)保证选择的值是改变的!

onmousedown 单击一次就查询一次,所以每选择一次就查询一次,增加了数据库的负担。每次选择至少要查询两次(一次是在数据库加载数据,一次是选择选项时又触发一次,)

咧:

<select name="expireDay" id="expireDay" class="form-control"

onchange="searchChange(this.options[this.options.selectedIndex].value);">

<!-- <option value="" >---请选择---</option> -->

<option

<c:if test="${'0' == expireRemind.searchType}">

selected

</c:if>

value="0">aa</option>

<option

<c:if test="${'1' == expireRemind.searchType}">

selected

</c:if>

value="1">bb</option>

</select>

可以显示和隐藏

function searchChange(obj){

if(obj=="0"){

$('#expireDate').hide();

$('#soonExpireDay').show();
}

if(obj=='1'){

$('#soonExpireDay').hide();

$('#expireDate').show();
}
}

(7)js下拉onchange扩展阅读

通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。

是一种解释性脚本语言(代码不进行预编译)。

主要用来向HTML(标准通用标记语言下的一个应用)页面添加交互行为。

可以直接嵌入HTML页面,但写成单独的js文件有利于结构和行为的分离。

跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。

Javascript脚本语言同其他语言一样,有它自身的基本数据类型,表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方,表达式则可以完成较复杂的信息处理。

『捌』 js给下拉框的value或selectedIndex赋值,不触发onchange事件吗

可以,但是不知道你把onchange时间加在什么地方了


上面的版代码时候这样的

<select name="style" id="style">

<option value="1">类型</option>

<option value="2">图层</option>

<option value="3" selected="selected">产品</option>

</select>

如果要加权onchange事件,是这样的$("#style").change(function(){console.log("123")})

『玖』 js 动态创建select 并赋予onchange事件

mySelect.addEventListener('change',function(){
return mychange.apply(this,[this.value,pid,num]);
});

推荐你几个链专接属
http://developer.mozilla.org/en/Core_JavaScript_1.5_Guide
http://ejohn.org/
http://quirksmode.org/

阅读全文

与js下拉onchange相关的资料

热点内容
wpsword锁定 浏览:910
新浪邮箱可以邮寄多少文件 浏览:27
孩子学编程如何提高效率 浏览:942
iphone4无法设置呼叫转移 浏览:414
如何设置首页数据 浏览:525
尸吻在线观看免费完整版 浏览:764
陈锋羽婷全文免费阅读 浏览:478
狐狸电影全部 浏览:279
iphone6ink 浏览:49
windows系统注册表系列视频教程 浏览:864
主角是华人建国的小说 浏览:698
下载压缩文件付费的平台 浏览:461
在线处理psd文件 浏览:367
古代电影免费在线观看 浏览:711
淫小说网址 浏览:898
如何在电脑上用数字编程 浏览:178
神豪系统类小说 浏览:46
oa系统怎样批量下载文件 浏览:299
mpp大数据体系 浏览:144
穿越雪中悍刀行收女主的小说 浏览:54

友情链接