首页
学习
活动
专区
圈层
工具
发布

JQuery 入门学习(三)

看到Jquery代码,它为按钮绑定了click事件,点击按钮后,执行$('#test').load('http://www.w3school.com.cn/example/jquery/demo_test.txt...这是一个javascript函数,当点击按钮时执行此函数。首先选择器选择了id=name的文本框,用val()方法获取其值,并赋值给name变量。     看后面,用到了get方法。...第三个参数callback是一个回调函数,这个函数在获取到数据后运行,也就是说收到的数据可以在这个函数中处理。...大家可以试验,点击了按钮后,打印出了php中定义的数组内容。php端两行代码,定义了一个数组,并用json_encode把数组做成一个json编码的字符串输出。    ...配合上Jquery,原本就不复杂的ajax变得更加简单,而且在各个浏览器上都能很好地运行。

9.8K20

3个web小游戏制作只需基础三剑客—html+css+js

试玩页面如下: http://luyishisi.github.io/game1/ 所以,一开始是先画一个按钮,加入JavaScript函数,触发点击事件修改按钮的背景颜色。再次点击则再次修改。...开始吃午饭了,一路上我就如何把按钮旁边的颜色变化这个问题,求教大师兄。他提供的解决方案,是运用jQuery的遍历,刚好昨天学了jQuery,这个思路是不错的。...后来超哥也提供一个思路,就是用二维数组表示数值,点击按钮修改数租参数,再调用一个函数,刷新所有按钮的值。...编写思路: 16个按钮构成界面 通过js修改value值 js捕捉键盘事件抓住方向键触发 触发事件修改按钮的value值 写运行算法,根据按钮value对应的数值得出新值 修改与测试 运行界面: 请不要嘲讽我难看的设计...,相同则++; 3:手机上显示不是很切合,还未解决.. 4:不同浏览器可能看到的排版效果不同,未测试.

4.1K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    浅谈JavaScript

    的介绍 1、jQuery的定义 jQuery是对JavaScript的封装,它是免费、开源的JavaScript函数库,jQuery极大地简化了JavaScript编程。...ajax是一个前后台配合的技术,它可以让javascript发送异步的http请求,与后台通信进行数据的获取,ajax最大的优点就是实现局部刷新,ajax可以发送http请求,当获取到后台数据的时候更新页面显示数据实现局部刷新...提示:在html页面使用ajax需要在web服务器环境下运行,一般向自己的web服务器发送ajax请求。...,常用的是‘json’格式 dataType:'json', //4.data 设置发送给服务器的数据,没有参数不需要设置 //5.success 设置请求成功后的回调函数...设置请求成功后的回调参数 error设置请求失败后的回调函数 async设置是否异步,默认值是‘true’,表示异步,一般不用写 同步和异步的说明: 同步是以恶搞ajax请求完成另外一个才可以请求,需要等待上一个

    3.7K30

    图解浏览器引用本地硬盘上的JS文档

    一、临时需要引入本地js文档 点击浏览器“编辑”菜单,选择“运行JS代码”,打开运行JS脚本代码的窗口。...输入JS代码后,点击“执行JS”按钮,浏览器自动在当前网页上完成引入JS文档和执行自定义脚本代码。...打开“引入JS文档”下拉列表框,自动列出软件目录下的js文件夹下所有JS文档,如果选择引入jquery库,然后就可以在代码中直接使用JQuery编码。...关闭项目管理器,再回到浏览器的主窗口,此时书签栏显示了”自动引入JQ”项目。不管哪个网站页面,需要时只要打开页面后点击这个书签按钮就可引入JQuery库。...为了提高浏览器性能,每个页面只需引入一次同一个JS文档,如果多次执行引入相同的JS文档,则只有首次执行引入操作。如果网页刷新或跳转后,则需重新执行引入操作。

    2.8K00

    最新jquery+easyui_api培训文档

    fn(b):当用户点击按钮后触发的回调函数,如果点击OK则给回调函数传true,如果点击cancel则传false。...msg:提示窗口显示的消息文本。fn(val):用户点击按钮后的回调函,参数是用户输入的内容。...: 当一个按钮被点击时的处理函数 null showPageList 布尔 定义是否显示页面列表 true showRefresh 布尔 定义是否显示刷新按钮 true beforePageText 字符串... 事件 Window的事件和面板(panel)的事件相同 9.4 方法 除了”header”和”body”以外,Window的函数方法和面板(panel)的相同 10 Panel(面板) 10.1 实例...标签加载远程数据完成时被触发,参数和jQuery.ajax成功返回的回调函数相同 onSelect title 当用户选择一个标签面板时被触发 onClose title 当用户关闭一个标签面板时被触发

    4.4K40

    Django如何与ajax通信

    : 当我们点击这个button后,触发js代码,然后ajax会将必要信息包装好,即 url:这个url是在urls.py文件中已经注册好的,而且它与views.py中的一个函数进行了绑定 data:其实就是个字典...,这个data是作为输入数据以GET的形式传给后台 success:这个表示当数据建立通信且后台代码处理完后需要执行什么样的操作。...).ajax,或者$.post表示post请求 id=”tn” 对应着js中获取的参数名称$(“#tn”) id=”formquery” 对应着按钮事件所对应的js的函数名称 id=’result’ 对应着结果返回到哪个位置...有时候网页中的某些功能需要比较长的时间等待,这时候使用ajax是比较好的,因为它不需要整个网页刷新,用户体验比较好。...而按钮加载过渡的意思,就是当你点击按钮后,按钮字体内容变为“加载中”,等到ajax返回内容后再恢复,这样会使体验更好。

    2.2K20

    「jQuery」基础 - 03

    案例:发布微博案例 点击发布按钮, 动态创建一个小li,放入文本框的内容和删除按钮, 并且添加到ul 中。 点击的删除按钮,可以删除当前的微博留言。 jQuery 多库共存 实际开发中,很多项目连续开发十多年,jQuery版本不断更新,最初的 jQuery 版本无法满足需求,这时就需要保证在旧有版本正常运行的情况下,新的功能使用新的jQuery版本实现...总结:jQuery插件就是引入别人写好的:html 、css、js (有时也可以只引入一部分,读懂后也可以修改部分内容) 1.4.2....1.7.2 案例:toDoList 分析 刷新页面不会丢失数据,因此需要用到本地存储 localStorage 核心思路: 不管按下回车,还是点击复选框,都是把本地存储的数据加载到页面中,这样保证刷新关闭页面不会丢失数据...核心原理:先获取本地存储数据,删除对应的数据,保存给本地存储,重新渲染列表li 我们可以给链接自定义属性记录当前的索引号 根据这个索引号删除相关的数据----数组的splice(i, 1)方法 存储修改后的数据

    4.1K30

    jQuery笔记(3)

    jQuery元素操作 主要是遍历,创建,添加,删除元素操作 遍历元素each() jQuery隐式迭代是对同一类元素做了相同的操作,如果想要给同一元素做不同的操作,就需要用到遍历 语法1:...$("div").each(function(index, domEle){xxx;}) each()方法遍历匹配的每一个元素.主要用DOM处理.each每一个 里面的回调函数有2个参数,index是每个元素的索引号...function(index, element){xxx;}) $.each()方法可用于遍历任何对象.主要用于数据处理,比如数组,对象 里面的函数有2个参数:index是每个元素的索引号,element...,显示"返回顶部"的按钮,点击以后就可以回到页面顶部的功能....但是这个导航栏其实是有bug的,比如我们重新刷新页面时,即使页面在很下面,导航栏也没有出现 这是因为我们将它放入了滚动事件中,刚刷新完是没有滚动的,所以自然不会出现,所以我们要将里面的代码封装成函数

    96610

    接口测试平台代码实现150:加密算法继续实现

    现在我们来立马实现一下 取消和保存功能: 取消功能很简单,我们写个刷新即可:注意修改俩个按钮的onclick: 好,继续开始,我们去写保存功能: 这个函数并不复杂,但是我依然要按部就班的去实现...name必须是一样的,value是要获取的值当然不一样,id是由前面相同后面不同。 然后提取是靠一段jquery 实现,如果是js则太过麻烦了。...接下来是提取输入框的内容,也就是加密表达式: 好提取成功后,我们写个请求给后台: 注意,其中传递了项目id,和加密插入位置 和加密表达式。...所以encryption_show()这个函数,此时要继续扩写了。...这里我们仍然用jquery来快速实现这个功能,代码如下: 这里我采用了拼接方案,用数据库的值直接就拼成了 目标选框的id, 这也是我一开始起id的时候故意设计,是不是很讨巧。

    67430

    前端成神之路-03_jQuery

    案例:发布微博案例 1.点击发布按钮, 动态创建一个小li,放入文本框的内容和删除按钮, 并且添加到ul 中。 2.点击的删除按钮,可以删除当前的微博留言。 ​ 代码实现略。...多库共存 ​ 实际开发中,很多项目连续开发十多年,jQuery版本不断更新,最初的 jQuery 版本无法满足需求,这时就需要保证在旧有版本正常运行的情况下,新的功能使用新的jQuery版本实现,这种情况被称为...插件就是引入别人写好的:html 、css、js (有时也可以只引入一部分,读懂后也可以修改部分内容) 1.4.2....核心思路: 不管按下回车,还是点击复选框,都是把本地存储的数据加载到页面中,这样保证刷新关闭页面不会丢失数据 // 3....(i, 1)方法 // 5.存储修改后的数据,然后存储给本地存储 // 6.重新渲染加载数据列表 // 7.因为a是动态创建的,我们使用on方法绑定事件 1.7.6 案例:toDoList 正在进行和已完成选项操作

    3.8K20

    jquery清除定时任务

    jQuery清除定时任务在使用jQuery编写前端代码时,我们经常会用到定时任务来周期性地执行特定的操作,比如定时刷新数据、定时轮播图片等。...使用setInterval设置定时任务在jQuery中,通常使用setInterval函数来设置定时任务,该函数按照指定的时间间隔周期性地执行指定的函数。...应用场景假设我们有一个网站,在用户登录成功后会显示一个欢迎提示框,我们希望该提示框在显示5秒后自动消失,同时提供一个“关闭”按钮,用户也可以主动关闭提示框。...同时,我们为提示框中的按钮绑定了点击事件,当用户点击“关闭”按钮时,会清除之前设置的定时任务并立即隐藏提示框。...它的工作原理是在每个指定的时间间隔后重复执行指定的函数,直到被取消或页面被关闭。下面将详细介绍setInterval函数的用法和一些注意事项。

    1.2K10

    前端开发面试题总结之——JAVASCRIPT.One

    call和apply的功能基本相同,都是实现继承或者转换对象指针的作用; 唯一不通的是前者参数是罗列出来的,后者是存到数组中的; call或apply功能就是实现继承的;与面向对象的继承extends...(1)我们在网页中的某个操作(有的操作对应多个事件)。 例如:当我们点击一个按钮就会产生一个事件。是可以被 JavaScript 侦测到的行为。...; 消除代码运行的一些不安全之处,保证代码运行的安全,限制函数中的arguments修改,严格模式下的eval函数的行为和非严格模式的也不相同; 提高编译器效率,增加运行速度; 为未来新版本的Javascript...// 同步:浏览器访问服务器请求,用户看得到页面刷新,重新发请求,等请求完,页面刷新,新内容出现,用户看到新内容,进行下一步操作。...])用一个或多个其他对象来扩展一个对象,返回被扩展的对象 jQuery.fn.extend(object); //对jQuery.prototype进行的扩展,就是为jQuery类添加“成员函数”。

    1.4K10

    Django使用JQuery实现Ajax请求

    Ajax通常用于要连接数据库的地方,但是连接数据库传输的信息量又很少,用不着刷新整个页面,这种类型的适合用ajax,避免了刷新整个页面带来的资源浪费。 Ajax工作原理: ?...二、Django中用JQuery实现Ajax异步请求 JQuery是Javascript的一个封装库,JQuery极大地简化了 JavaScript 编程。...一,在html页面中引入js文件: jquery_2.1.1_jquery.min.js' %}"> 二,在html页面中编写需要局部刷新的...,当点击AJAX提交按钮的时候,会执行ajax请求,访问url url:"/ajax_text/" 并将输入的关键字传给blogtitle,到后台访问数据库;当ajax引擎拿到返回的数据后,会将得到的文本数据赋值给...三,在url.py里编写访问路由路径 path('ajax_text/',views.blogtitle), 四,在views.py里编写从数据库获取数据的视图函数 def blogtitle(request

    4.3K20

    Wijmo 更优美的jQuery UI部件集:从wijwizard和wijpager开始

    保存你的工程,并在浏览器中打开。它将看起来像下面这样: ? 当部件包含多于一个页面的时候,导航按钮将自动的被添加到部件上。你可以更改,甚至删除控件上显示的导航按钮。...,并刷新浏览器,wijwizard将不再显示导航按钮,如下图所示: ?...保存该工程,并且刷新浏览器。该工程看起来像是这样: ? 现在你拥有header了,但是你没有导航,因为你在之前的某步操作中已经把它删除了。...但是标记应当如下面所示: 现在向(document).ready 函数添加jQuery。...你需要初始化wijpager,设置它的pageCount,pageIndex,以及mode属性,同时添加一个函数处理它的pageIndexChanged事件。

    3.4K70
    领券