项目中实现虚拟点击操作

一、HTML中的data属性    使用data属性来嵌入自定义的数据   data-*="  "

在项目中有一个问题,经常需要获得当前行或者一个位置的值,比如我项目中需要在后台php文件中foreach循环输出一行<tr>,然后将这个<tr>传到前台页面中,

 foreach ($res as $k => $v) {
            $str .= "<tr>
        <td>{$v[‘0‘]}</td>
        <td><input value=‘{$v[‘1‘]}‘></td>
        <td><input value=‘{$v[‘2‘]}‘></td>
        <td><input value=‘{$v[‘3‘]}‘></td>
        <td><input value=‘{$v[‘4‘]}‘></td>
        <td>
         <button id=\"btn\" data-bumen=\"{$v[‘2‘]}\" onclick=‘dele(this)‘ value=\"{$v[‘0‘]}\" >立即删除</button>
         <button onclick=‘sub(this)‘ value=\"{$v[‘0‘]}\" >立即修改</button>
        </td>
        </tr>";
        }

此时$v是我数据库中的单行数据,通过$v[‘ ‘] ,来获取当前字段的值, 将第一个button按钮设置一个data属性,它里面保存的是每循环一行时的$v[‘ 2 ‘]的值,

这个值每次都是不一样的,在js中进行接收并判断

 function dele(parm) {

            var id = parm.value;
            var type = ‘del‘;

            var btn = document.getElementById("btn");
            var btn_vue = btn.dataset.bumen;
            // console.log(btn_vue);

            var xml = new XMLHttpRequest;
            xml.onreadystatechange = function() {
                if (xml.readyState == 4 && xml.status == 200) {
                    alert(xml.responseText);
                    if (btn_vue == "财务部") {
                        document.getElementById(‘bma‘).click();
                    }
                    if (btn_vue == "生产部") {
                        document.getElementById(‘bmb‘).click();
                    }
                    if (btn_vue == "招商部") {
                        document.getElementById(‘bmc‘).click();
                    }
                }
            }

            xml.open("POST", "/select.php");
            xml.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xml.send(‘id=‘ + id + ‘&type=‘ + type);
        }

var btn来获得这个按钮,声明变量 btn_vue 来获得自定义属性的值(也就是获得data属性中的$[ ‘2 ‘ ])

var btn = document.getElementById("btn");

var btn_vue = btn.dataset.bumen;

<button data-bumen=\"{$v[‘2‘]}\"> 立即删除 </button>;

此时我们已经获得这个值,但是有一点之前已经说过,$v[‘ 2 ‘] 这个值不是固定的,所以我们在ajax接收的时候要进行判断



                    if (btn_vue == "财务部") {
                        document.getElementById(‘bma‘).click();
                    }
                    if (btn_vue == "生产部") {
                        document.getElementById(‘bmb‘).click();
                    }
                    if (btn_vue == "招商部") {
                        document.getElementById(‘bmc‘).click();
                    }
通过判断不同的值,来创建一个虚拟点击操作,实现自动刷新的一个功能
 

原文地址:https://www.cnblogs.com/dumenglong/p/11294386.html

时间: 2024-10-08 13:05:16

项目中实现虚拟点击操作的相关文章

DotNet项目中的一些常用验证操作

在项目中需要对用户输入的信息,以及一些方法生成的结果进行验证,一般在项目中较多的采用js插件或js来进行有关信息的校验,但是从项目安全性的角度进行考虑,可对系统进行js注入. 如果在后台对用户输入的信息进行验证会相对的安全,在出现信息验证不合法时,可以直接在程序中抛出异常,终止程序的运行. 现在提供几种较为常用的验证方法,可以减少在项目中开发时间和错误性: 1.判断域名:         /// <summary>         /// 普通的域名         /// </summ

【前端笔记】项目中运用到的前端操作

1.对于checkbox的操作: 在信息列表中,我们通常希望按住一个按钮就全部选中所有按钮,这个需要结合checkbox的checked事件和JS函数作处理 <html> <head> <script type="text/javascript"> function checkAll(obj){ var check = document.getElementsByName("checkbox"); if(obj.checked =

在C#项目中需要用double类型操作MSSQL float类型数据(附C#数据类型和SQL数据类型对照)

C#操作SQL Float类型,数据会多很多小数,原来是C#的float和sql的float类型不一致.以下是数据库中与C#中的数据类型对照. /// <summary> /// 数据库中与C#中的数据类型对照 /// </summary> /// <param name="type"></param> /// <returns></returns> private string ChangeToCSharpTyp

项目中遇到的[数据库并发]操作问题,大牛来指导下!!!

使用Jmeter测试应用的浏览数的时候,起10个线程,同时执行浏览应用的API,本来预期应用的浏览次数增加10,结果始终达不到10.猜测这可能是个典型的并发案例.jmeter操作截图如下: 于是我尝试在程序中打日志,确定一下我的猜想: 日志表明,总有几个线程是在同一时刻操作数据库的,造成浏览次数遗漏! 请问,这种情况,我应该怎么做并发控制?我用的mysql数据库.

grails项目中(DB的相关操作)

save:保存Domain对象的数据到对应的库表中(可能是insert也可能是update) findBy: 动态方法,查找并返回第一条记录,方法名可以变化 eg:findByName("Tom") 会返回所有name属性为Tom的对象(只返回第一条记录) findByNameAndPassword("Tom","Mot")会返回所有name属性为"Tom"并且password属性为"mot"的对象 fin

iOS高级开发——CollectionView的cell中按钮的点击实现

在我刚初学iOS的时候,我就问一些大神,iOS开发中最难的哪些部分.有些人就说是自定义控件.UI和交互设计.那个时候我将信将疑,随着自己开发的深入,自己的确是深有体会.开发一款App产品,很大一部分时间是在和UI打交道.因为开发中很多功能是直接封装好的或者有现成模板可以用的,唯有UI是根据不同的App千变万化的.所以今天我们继续来研究iOS中比较高级的控件--UICollectionView,来实现cell中按钮的点击操作.该demo我已经提交到: https://github.com/chen

asp.net Web项目中使用Log4Net进行错误日志记录

使用log4net可以很方便地为应用添加日志功能.应用Log4net,开发者可以很精确地控制日志信息的输出,减少了多余信息,提高了日志记录性能.同时,通过外部配置文件,用户可以不用重新编译程序就能改变应用的日志行为,使得用户可以根据情况灵活地选择要记录的信息. 那么我们如何在Web项目中使用Log4Net呢? 一.基本配置 1.下载Log4Net,地址如下:http://logging.apache.org/log4net/download_log4net.cgi,如下图所示: 2.下载到本地后

最近项目中使用Spring data jpa 踩过的坑

最近在做一个有关OA项目中使用spring data JPA 操作数据库,结果遇到了补个不可思议的麻烦.困惑了好久. 首先看一下问题吧,这就是当时测试"设置角色时,需要首先删除该用户已经拥有的角色时"报错如下图: 一开始遇到这个问题 并没有感觉到有多大问题,后来就找了几个小时还是没有结果....后来在网上搜了好多还是没有找到结果...这时的自己就崩溃了,于是就去网上 搜索有关spring data jpa 相关Insert 和delete 及update的等操作问题,结果一眼就看到了问

SpringBoot Mybatis项目中的多数据源支持

1.概述 有时项目里里需要抽取不同系统中的数据源,需要访问不同的数据库,本文介绍在Springboot+Mybatis项目中如何支持多数据源操作. 有需要的同学可以下载 示例代码 2.建数据源 首先,我们建两个测试库 test1 test2,分别建两个表,分别添加一些测试数据 CREATE TABLE `groupidinfo` ( `id` int(11) NOT NULL AUTO_INCREMENT, `groupId` varchar(255) DEFAULT NULL, `versio