您当前的位置:首页 > 互联网教程

onChange和onClick的区别

发布时间:2025-05-23 06:39:14    发布人:远客网络

onChange和onClick的区别

一、onChange和onClick的区别

OnChange经常用于select下拉列表选中后的内容发生改变时候触发

OnClick表示的是点击该控件时触发

OnChange:当控件的内容发生改变时触发该事件

可以在标签元素上使用<input onchange=""></input><input onclick=""></input>

也可以 jsobject.onchange=function(){SomeJavaScriptCode};

$('').change(function({}))或者;$('').click(function({}))

事件一、onclick(下面是静态注册单击事件示例)

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>The event of script</title>

<script type="text/javascript">

alert("您点击了我我是一个单击钮触发的事件并且此处由静态加载!!");

<input type="button" onclick="onclickEvent();" value="单击事件静态"/>

事件二 onchange动态和静态注册(内容发生改变事件)

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

alert("静态注册的onchage事件");

alert("现在页面未加载但是男神下拉框已经被静态绑定了onchange改变事件");

// 1.通过id属性值获取第二个select标签对象 var selectObj= document.getElementById("select01");

// 2.通过标签对象.事件名= function(){}

alert("现在页面加载完成对女神下拉框动态注册onchange事件中");

selectObj.onchange= function(){

alert("这是动态创建的onchange事件");

<select onchange="onchangeFun();">

<option selected="selected">刘德华</option>

<option>张学友</option>

<option>张国荣</option>

<option>李四</option>

<option selected="selected">张三</option>

<option>王五</option>

参考资料来源:百度百科-javascript

二、select中onchange的用法

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

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

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

4、<selectname="expireDay"id="expireDay"class="form-control"

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

6、<!--<optionvalue="">---请选择---</option>-->

7、<c:iftest="${'0'==expireRemind.searchType}">

8、value="0">aa</option>

9、<c:iftest="${'1'==expireRemind.searchType}">

10、value="1">bb</option>

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

12、$('#soonExpireDay').show();

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

14、$('#expireDate').show();

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

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

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

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

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

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

21、参考资料来源:百度百科-javascript

三、用js怎么触发textBox的textChanged事件

1、可以先定义一个函数,即textChange要执行的内容函数,然后在对应的textBox标签中用onchange=""来调用那个textChange函数。

2、步骤一:定义一个text标签,添加onchange为空;其html代码如下所示:

3、<input type="text" onchage=""/>

4、步骤二:定义要执行的textChange函数,其JS代码如下所示:

5、function demo(){//demo是函数名

6、步骤三:将这个demo()函数赋给input标签的onchange;即html代码为:

7、<input type="text" onchage="demo()"/>

8、这样的话,在文本框的值变化是就会调用这个函数了