项目中实现虚拟点击操作

发布时间:2022-04-30 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了项目中实现虚拟点击操作脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

一、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 + &amp;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(); }
通过判断不同的值,来创建一个虚拟点击操作,实现自动刷新的一个功能

脚本宝典总结

以上是脚本宝典为你收集整理的项目中实现虚拟点击操作全部内容,希望文章能够帮你解决项目中实现虚拟点击操作所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。