您好,欢迎访问一九零五行业门户网

JQuery从头学起第二讲_jquery

这一讲中,主要对jquery的选择器做个简单的介绍,jquery是怎么样来获取到值的。废话不多说,直接贴代码,我们根据demo来说事。
复制代码 代码如下:
从代码的第一行可以看出,其实这是个aspx页面,其实把第一行去掉也没关系,因为jquery就是javascript脚本,在html里也同样可以运行。因为我是用vs写的jquery所以就直接添加aspx页了。
代码中东西很少,头部写了两段javascript脚本,body中有一个文本输入框,两个按钮,一个按钮有onclick=btnclick();事件,另一个没有。从运行的效果看,其实两个button实现的是相同的效果,都是弹出文本框输入的内容。现在我们来简单分析下这两段js
在第一段js中,自定义了个函数,名字叫:btnclick(),该函数体内用var 关键字定义了个变量t1。t1的值通过jquery的选择器得到。$(#txt1)创建了一个jquery的对象,#取的是id,如果换成name则会得不到值。$(#txt1)的val()方法获取到了文本框的值。$(#txt1).val()相当于javascript中的document.getelementbyid(txt1).value;
第一个button中onclick事件执行了第一段js中的自定义函数,那么第二个button中没有onclick事件,如何实现与第一个button相同的效果呢?我们接下来分析第二段js代码。
第二段js代码中一开始就直接创建了个jquery的document对象,并调用了document对象的ready事件,ready事件会在dom加载完后立即执行。在ready事件中又建了个jquery对象$(#btn2),从该对象可以看出jquery选择的是id为btn2的控件。创建$(#btn2)的同时调用了onclick();方法。正是这个方法实现了让button二实现了和button一相同的效果。这里简单说下,在第二段js代码中如果把$(document).ready(function() {});这个事件去掉,直接写$(#btn2).click(function() { var t1 = $(#txt1).val(); alert(t1); });那么点击第二个button将不会有任何的效果。
今天这一讲就到此,其他不赘述,如果有疑问或需要源码可以加入群:34979719,下一讲,我们将会讲常用控件的取值和赋值。
其它类似信息

推荐信息