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

04_使用JS完成功能

如果是有名称,那么在html页面中只能写一个。 onmouseover/onmouseout/onmousemove:购物网站商品详情页。...checkOnes[i].checked=false; } } } 8.使用JS完成省市二级联动 技术分析 事件(onchange) 使用一个二维数组来存储省份和城市...() createElement() appendChild() 步骤分析 第一步:确定事件(onchange)并为其绑定一个函数 第二步:创建一个二维数组用于存储省份和城市 第三步:获取用户选择的省份...第四步:遍历二维数组中的省份 第五步:将遍历的省份与用户选择的省份比较 第六步:如果相同,遍历该省份下所有的城市 第七步:创建城市文本节点 第八步:创建option元素节点 第九步:将城市文本节点添加到...="city"> JS代码: //1.创建一个二维数组用于存储省份和城市 var cities = new Array(3); cities[0] = new

4.8K60

Ext基础

在 Jack 的开发和社区氛围的营造下,Yui-Ext 已经成为一个成熟的 Ajax UI框架,且此框架是独立的,不受 YUI 的影响并兼容 JQuery、Prototype 等多种JS库。...在 Ext 中,Grid控件和其他显示数据的控件能够支持多种数据类型 (二维数组、JSON数据和 XML数据等)甚至自定义的数据类型。...“var data =…”用于定义表格中的数据,共包含4条记录,是一个二维数组,在页面上显示为4行,每行6列,分别对应 empId、userName、sex、birthday、address 和 remark...“var store = new Ext.data.Store()” 用于创建数据的存储对象,负责将各种原始数据(如二维数组、JSON对象数组、文本等) 转换成Grid可以使用的形式,避免为每种数据格式都编写对应的实现...n 在 Ext中,Grid控件和其他显示数据的控件能够支持多种数据类型 (二维数组、JSON数据和 XML数据等)甚至自定义的数据类型。

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

    JS的常用操作

    三 、使用 JS 完成页面定时弹出广告 1.需求分析 我们希望在首页中的顶部做一个定时弹出广告图片。...> 八、使用JS完成省市二级联动 1.需求分析 我们希望在注册页面中添加一个字段(籍贯),当用户选择一个具体的省份,在后面的下拉列表中动态加载该省份下所有的城市。...显示的效果如下: 2.技术分析 事件(onchange) 使用一个二维数组来存储省份和城市(二维数组的创建?)...() createElement() appendChild() 3.步骤分析 第一步:确定事件(onchange)并为其绑定一个函数 第二步:创建一个二维数组用于存储省份和城市 第三步:获取用户选择的省份...第四步:遍历二维数组中的省份 第五步:将遍历的省份与用户选择的省份比较 第六步:如果相同,遍历该省份下所有的城市 第七步:创建城市文本节点 第八步:创建option元素节点 第九步:将城市文本节点添加到

    9.4K10

    三分钟让你了解什么是Web开发?

    服务器端脚本可以读取浏览器通过POST发送的值,然后处理它或将其存储到文件或数据库中。简单地说,这就是数据如何被推送到服务器,然后最终存储在一个文件或数据库中。...通过以博客平台为例,我们将重新讨论到目前为止讨论过的所有主题,并了解如何使用MVC架构来编写代码。...为了克服这种无状态性,客户需要在每个请求中发送额外的信息,以在多个请求期间保留会话信息。这些额外的信息存储在cookie的客户端,在会话的服务器端。 会话是一个数组变量,它存储跨多个页面使用的信息。...会话由惟一ID标识,其名称依赖于编程语言——在PHP中称为“PHP会话ID”。在客户端浏览器中,需要将相同的会话ID存储为cookie。 显示个人博客 我们的下一个项目是展示个人博客帖子。...与CSS和JS一起将数据插入到HTML模板中。 以上所有代码都可以写在一个文件中。这是早期的做法,但是发展联盟意识到这不是最优的。要添加任何新特性,需要更改整个代码,在多开发环境中工作并不容易。

    9.3K30

    项目开发知识盲区记录

    项目开发知识盲区记录 解决ajax请求下,后台页面跳转无效问题 layui数据表格的使用和分页失效的问题解决 layui的数据表格的cols属性设置列的二维数组的[[....]]和thymeleaf的语法重复...,因此在使用springboot的模板引擎进行渲染时,会报错误,解决方法如下: 从ajax的回调函数(success等)中取返回值 layui-table表复选框勾选的所有行数据获取 html网页什么样的字体最好看...layui分页失效问题 layui数据表格分页无法正常显示 ---- layui的数据表格的cols属性设置列的二维数组的[[…]]和thymeleaf的语法重复,因此在使用springboot的模板引擎进行渲染时...:当作映射失败处理,并抛出异常和详细信息 auto-mapping-unknown-column-behavior: none #如果查询结果中包含空值的列,则 MyBatis 在映射的时候...第二种方式 页面正常通过Key-Value的形式传值,数组使用逗号分割的形式的字符串(可以使用toString()或join()将数组转成这种格式),后端使用String[]数组接值。

    8K32

    PHP第二节

    ; 使用一个字符串分割另一个字符串 implode(连接符,执行连接的数组); 将一个一维数组的值拼接为字符串 substr( 字符串,起始索引,截取长度 );...> 百度一下 二维数组 数组中的每一个元素,又是一个数组 //二维数组的形式 $arr=[ [2,3,4,5,6...数据读写到文件(数据持久化) 程序运行过程中,数据存储在内存中的,程序结束, 数据会销毁 如果希望可以永久存储某些数据,可以将数据存储在硬盘上(存储在文件中) 将数据由 内存 存储到硬盘的过程,称为数据持久化...; file_get_contents(path) 根据路径读取文件内容, 得到一个字符串 file_put_contents(path,$str) 将一个字符串写入到一个文件中。...name命名形式必须为:name[],最终数据才能以数组的格式,将各个选项的值同时提交,否则只能提交最后一个勾选的属性值。不同的选项值,以数组元素的形式提交。

    2K30

    基于Jquery WeUI的微信开发H5页面控件的经验总结(2)

    在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI...,本篇随笔结合官方案例和自己的项目实际开发过程的经验总结,对在H5页面开发过程中设计到的界面控件进行逐一的分析和总结,以期能够给大家在H5页面开发过程中提供有用的参考。      ...7)条码、二维码生成      在我们做一些扫码操作的时候,我们可能需要根据一些参数生成一些URL,然后生成一个二维码的方式,方便手机扫码直接查看,或者给一些条码设备进行条码的读取,那么这两种情况结合起来就是二维码和条码的处理场景...+ data.ErrorMessage, "forbidden");      }      });      复制代码      $.ajax()是jquery中通用的一个ajax封装,其语法的格式为...,如何移除单个或者所有的集合,这个就用到了splice()函数,如下代码所示。

    1.9K20

    Vue—前端框架

    data中定义 2、在页面中,插值表达式{{}}可以引用变量的值,即vue实例的属性值 3、在外部可以通过vue对象名.属性的方式获取属性值,在vue对象内部,通过this.属性的方式获取属性值 值就是绑定方法的返回值 3、在该方法中,所有的变量都会被监听到,任何一个变量发生变化,都会触发该绑定方法,从而更新方法属性的值,不管这个值受不受到变化 id="app">...4、多复选框:v-model存储的值为多复选框value的数组,加入数组的顺序是点击选项的顺序 id="app"> <!...$cookie = VueCookie // 持久化存储val的值到cookie中 this.$cookie.set('val', this.val) // 获取cookie中val字段值 this....被加载的页面组件,需要在router文件夹下的index.js文件中注册路由,在1中通过to="页面组件的路由"的方式实现页面组件的路由跳转 3 页面组件和小组件都需要使用导出语句定义实例,才能被其他文件导入

    8.3K30

    AJAX常见面试问题

    鼠标悬浮时间,调用方法,传入this,对所有的选项卡内容部分隐藏操作,对this的进行显示操作,控制display 5.级联 的实现思路 一般地区数据都是利用二维数组存储,从后台获取到以后存储起来..., 根据第一个下拉框的选项,找到对应的二维数组数据,循环new Option() add进下拉框 6....缺点: .AJAX干掉了Back和History功能,即对浏览器机制的破坏。 在动态更新页面的情况下,用户无法回到前一个页面状态,因为浏览器仅能记忆历史记录中的静态页面。...(例如,当用户在Google Maps中单击后退时,它在一个隐藏的IFRAME中进行搜索,然后将搜索结果反映到Ajax元素上,以便将应用程序状态恢复到当时的状态。)...一个相关的观点认为,使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中。

    3K20

    Jquery 常见案例

    ajaxForm 预处理将要使用AJAX方式提交的表单,将所有需要用到的事件监听器添加到其中。它不是提交这个表单。...在页面的ready函数里使用ajaxForm来给你页面上的表单做这些AJAX提交的准备工作。 ajaxForm 需要零个或一个参数。这唯一的一个参数可以是一个回调函数或者是一个可选参数对象。...从 0.91 版本开始, 这个方法 始终 返回一个数组。 如果没有符合条件的域,这个数组将会是个空数组,否则它将会包含至少一个值。 是否可以连环调用: 否, 这个方法返回的是一个数组。...这个方法将会清空所有的文本框,密码框,文本域里的值,去掉下拉列表所有被选中的项,让所有复选框和单选框里被选中的项不再选中。...可选参数项对象只是一个简单的 JavaScript对象,里边包含了一些属性和一些值: target 用server端返回的内容更换指定的页面元素的内容。

    9.5K10

    一个小时学会jQuery

    在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM。 ? 获得DOM对象的示例: 页面里获取元素并对其进行操作。如果你熟悉CSS,就会很清楚选择器的威力,通过元素的特性或元素在文档中的位置去描述元素组。...3.2.1、通过id获取元素 在CSS中经常使用id来控制元素,在jQuery中获取元素时,也使用同样方法。与CSS一样,在id前面加上#号。.../遍历一个数组或对象,for循环 $.inArray() //返回一个值在数组中的索引位置,不存在返回-1 $.grep()   //返回数组中符合某种标准的节点 $.extend({a:1,b:2}...如果要使用POST方法,可以设定type参数值。这个选项也会影响data选项中的内容如何发送到服务器。

    22.4K71

    PHP第三节

    获取前端传递图片,并保存在服务器中 3. 将表单的数据和上传图片的地址 保存在数据库中 4....5.把二维数组转成字符串 6.把字符串中的数据 存储到data.txt中 注意: 我们目前没有学习数据库,使用txt记事本来模拟,实现思路: 1....存储一个人的信息使用一维数组 2. 存储一个班的信息要使用二维数组 3. 数组是一个变量,页面关闭后,数据会销毁,下次打开页面后,数据不存在了 4....班级学生信息存放在二维数组中,添加和删除学生信息,就是对二维数组进行追加和删除,对二维数组操作完成后,再把二维数组存储到data.txt 展示功能 1.获取txt记事本中的学生数据字符串,转成二维数组...2.动态遍历渲染在页面中 删除功能 1.获取要删除学生id, 2.从data.txt中取出字符串形式学生数据 3.将字符串数据转成二维数组 4.根据id,从二维数组中删除指定索引的元素 5.把二维数组转成字符串

    2K10

    入坑!通过ajaxreturn jquery json提交form

    配置方式:convention.php中定义了默认编码类型为DEFAULT_AJAX_RETURN => 'JSON', 分析:ajaxReturn()调用了json_encode()将数值转换成json...数据存储格式,常用的数值是数组。...是独立于语言之外的存储和交换文本信息的语法。 2.2.2 json和ajax的关系?...整个过程是: 1.在php中编写页面中的表单、提交按钮等; 2.在js中对php中的按钮事件添加校验和触发函数,在js函数内,如果js对象的格式和内容正确就向控制器url(php中初始化)发起ajax请求...; 3.控制器中的相应操作响应ajax请求,并判断数据后做数据库读写操作,然后对数据库操作结果做出判断,ajaxReturn返回js需要的数组; 4.当ajax成功返回时,js中ajax的success

    5.9K30

    HTML5 CSS3

    sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。...答案:在js中,解析器在向执行环境中加载数据时,对函数声明和函数表达式并非是一视同仁的,解析器会率先读取函数声明,并使其在执行任何代码之前可用(可以访问),至于函数表达式,则必须等到解析器执行到它所在的代码行...但两者在参数上有区别的。对于第一个参数意义都一样,但对第二个参数: apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。...18、在Javascript中什么是伪数组?如何将伪数组转化为标准数组? 伪数组(类数组):无法直接调用数组方法或期望length属性有什么特殊的行为,但仍可以对真正数组遍历方法来遍历它们。...[1].在IE中,事件对象是作为一个全局变量来保存和维护的.所有的浏览器事件,不管是用户触发的,还是其他事件,都会更新window.event对象.所以在代码中,只要调用window.event就可以获取事件对象

    4.2K40

    jQuery 快速入门教程

    在jQuery库中实际上定义了一个jQuery()方法,它是jQuery库的核心。我们调用该方法并传入指定的参数,就可以返回一个jQuery实例对象,该对象中包含匹配的一个或多个DOM元素。...var c = $("#notFound").height(); // 如果不存在id为uname的元素,$("#uname")是一个空的jQuery对象,设置其value值,将忽略该设置操作,并返回该空对象本身...你可以使用animate()方法设置CSS样式,并执行一个从当前样式到指定样式的过渡动画效果。...在此之前,我们应该先了解jQuery对象所包含的DOM元素是存储在什么属性中的。 实际上jQuery对象是一个类数组对象。...它将匹配的所有DOM元素都依次存储在数字索引形式的属性中,并用length属性存储DOM元素的个数。

    15.2K30

    JQuery 入门学习(三)

    这一节涉及到浏览器与服务器的交互,我用到的是php,如果各位看官不会php脚本也没有关系,涉及到的php代码最多10行,重点还是在Jquery上。...甚至我们做一个网站,放上背景音乐,网站中一切链接都由ajax完成(比如点击了一片文章,ajax向服务器请求文章内容,然后用我上次说的Jquery html操作将网页中的一部分进行修改,这样文章就放入了页面而并不刷新页面...这是一个javascript函数,当点击按钮时执行此函数。首先选择器选择了id=name的文本框,用val()方法获取其值,并赋值给name变量。     看后面,用到了get方法。...在php5.2以上的版本,有了一对函数json_encode()和json_decode(),分别对php中对象进行json格式的编码和解码。     举个没什么营养的例子。     ...大家可以试想,假如图书馆有个图书检索系统,用户向服务器请求书名,服务器查询数据库后把所有符合条件图书信息做成一个二维数组,再用json形式发送给浏览器,Jquery把他们美化后输出,过程并不复杂。

    9.8K20

    PHP第五节

    先获取表单的标签的数据 保存上传的图片(并保存图片存储的路径) 将表单的数据和图片的路径一起保存到数据库中 保存完成,跳转到列表页,查看新添加的数据 展示功能思路: 先从数据库中获取数据(二维数组arr...) 遍历二维数组,将数组中数据渲染到页面中 删除功能思路: 获取要删除数据的id 根据id删除数据库中指定的数据 删除完毕,返回列表页 详情展示功能 获取要查看详情数据的id 根据id通过联合查询,获取到需要用数据...cookie 和 session 区分 cookie: 在浏览器端的 存储数据的 容器 session 在服务器端的 存储数据的 容器 cookie 在浏览器端的 存储数据的 容器 可以使用js对cookie...进行操作 cookie 允许服务器脚本(PHP脚本)在浏览器端存储数据 cookie特点:在cookie中数据设置后,浏览器再次请求服务器指定页面时,会自动携带cookie中的数据到服务器,在服务器中可以获取...cookie进行设置, cookie中的数据有效期,不设置是会话级别的, 浏览器关闭,会话结束,数据销毁 cookie存储容量小,约4kb session 在服务器端存储数据的容器 session容器是一个数组的形式

    2.8K20

    jQuery 教程

    ”) 所有选中的复选框选项 .selector $(selector).selector 在jQuery 1.7中已经不被赞成使用。...下面的例子演示如何获得链接中 href 属性的值: <!...返回被 jQuery 选择器匹配的 DOM 元素的数量 toArray() 以数组的形式检索所有包含在 jQuery 集合中的所有 DOM 元素 pushStack() 将一个DOM元素集合加入到jQuery...inArray() 在数组中查找指定值并返回它的索引值(如果没有找到,则返回-1) $.isArray() 判断指定参数是否是一个数组 $.isEmptyObject() 检查对象是否为空(不包含任何属性...对DOM元素数组进行排序,并移除重复的元素 $.uniqueSort() 对DOM元素数组进行排序,并移除重复的元素 $.data() 在指定的元素上存取数据,并返回设置值 $.hasData() 确定一个元素是否有相关的

    21.1K20
    领券