点击按钮更改对应段落(多个按钮之间互不影响)
来源:互联网 发布:java吧 百度贴吧 编辑:程序博客网 时间:2024/06/05 09:54
按钮一对应段落A,按钮二对应段落B,按钮三对应段落C.
点击按钮一,更改按钮及段落1的内容。点击按钮二更改按钮段落2的内容……
html:
<input type="button" value="btn1"><input type="button" value="btn2"><input type="button" value="btn3"><p>A</p><p>B</p><p>C</p>
js:
window.onload = function(){ var btn = document.getElementsByTagName('input'); var p = document.getElementsByTagName('p'); var arr =['张三','李四','王五']; for(var i=0;i<btn.length;i++){ btn[i].index = i;//只要进行匹配,就一定要写索引 btn[i].onclick = function(){ this.value = arr[this.index];//所点击按钮的value值 = 数组中相对应的值 // 第一个按钮对应第一个P,第二个按钮对应第二个P //p[this.index]含义:所点击的按钮对应的P的标签的内容 = 数组中相对应的值 p[this.index].innerHTML = arr[this.index]; } }}
注意:
只要进行相对应匹配的就要用索引值 btn[i].index=i;
更改匹配按钮的值:this.value = arr[this.index];
更改匹配段落P的值:p[this.index].innerHTML = arr[this.index];
阅读全文
0 0
- 点击按钮更改对应段落(多个按钮之间互不影响)
- 点击多个按钮之间互不影响(自定义属性)
- 多个按钮,点击单个按钮更改被点击按钮图片的方法
- cocos2dx点击按钮更改按钮图片
- 点击哪个按钮对应图片显示,按钮对应颜色显示
- 点击按钮打开多个窗口
- jquery实现多个点击复制按钮
- 设置一个监听器监听多个按钮事件(点击按钮进入一个指定的网站)
- 点击按钮显示对应的图片
- [js]多个按钮点击添加div,再点击删除
- 按钮点击事件更改dataTable Ajax源
- 多按钮,点击当前按钮变色,点击其它按钮恢复
- 表单操作,多个按钮的点击事件相同,当前只能点击一个按钮。
- 点击第一viewpager中的按钮,跳转到第二个radiogroup对应的fragment
- 关于多个按钮更改程序执行状态的实验
- Flex 如何实现按钮之间的切换,按钮点击事件
- Ubuntu下安装多个jdk互不影响
- HTML单选按钮(Radio)样式更改以及多选按钮(Checkbox)样式更改
- Hexo+github搭建个人博客(2)
- Spring异常处理 ExceptionHandler的使用
- 建设DevOps统一运维监控平台,全面的系统监控你做好了吗?
- Linux IO模式及 select、poll、epoll详解
- 从零开始的UART(基于S3C2440)
- 点击按钮更改对应段落(多个按钮之间互不影响)
- idea SVN 忽略文件夹classes、lib
- matlab 中如何使用bwboundaries获取连通区域并求取其轮廓
- Vue-高级讲师之笔记06
- Leetcode 309. Best Time to Buy and Sell Stock with Cooldown
- 代码更换SeekBar进度条颜色
- 课堂在线Java程序设计作业 类的使用
- 【总结】数据预处理
- Easyui combobox设置值和文本的几种方式和问题