我今天来说说添加乘机人选项框
在html中时不时就能看到一些添加按钮,例如说,一个添加按钮添加乘机人信息项。添加乘机人按钮的,其添加的内容(乘客信息),这里不是一个选项,而是一个div,这个div里放置的便是,乘机人信息。那么这个乘机的按钮点击后是怎么添加的这个内容的呢,其添加方法与添加选项框一般。
下面我就来说怎么添加这个项的
一、 在html中,放置乘机人按钮在button按钮中放置点击事件。当我点击她的时候除触发点击事件—执行点击事件里的方法。
二、 下面说说点击后的方法或函数
判断选项数的个数,即我添加个选项的个数
1、 获取到当前的选项(找到在.form-row 这个div下的)
2、 判断选项里的最大个数,即最大的选项数不能超过指定的数。比如我设置的值为9,那么说她在最大添加项到9的时候就不能进行添加。Else返回的内容为:当前添加的乘机人个数已达到上限不能进行添加。上面给了判断条件,但还不能添加,添加要有东西,那么下面我就需要给她设置一个添加的模板:也就是所谓的内容。我要声明一个选项,选项里的内容,就是我预设的内容。这个预设的内容与页面上原来已有的乘机人有部分的内容是有些许的不同。当我点击添加选项的时候,下面点击后出现的第二个乘机人,不同之处为标题的第二个乘机人。那么我就需要在前面给她声明一个全局变量为数组的,到自定义选项框里使用(这个全局变量)。
效果图如下(点击添加乘机人添加按钮,添加一个乘机人信息项)
总结:
添加乘机人的乘机人信息项,需要button按钮,点击后添加这个选项,自定义一个全局变量,这个变量里存放在与页面上不相同的部分。添加的内容为自定义的,可是是单纯的选项,亦或是如上面的一个html的div,里面的内容跟据需求改变。(可以设置成任何),通过设置添加乘机人按钮。页面看起来更美观,更为实用,一般而言大多为单人乘机,在多人乘机的时候,通过点击添加乘机人信息。
添加乘机人信息项
最新推荐文章于 2024-08-27 13:38:21 发布