1、动态添加div

 function cDiv(num){

 var oDiv=document.createElement("div");

 oDiv.className='divstyle';

 oDiv.id=num;

 oDiv.innerHTML=num;

 document.body.appendChild(oDiv);

 document.getElementById(num).className = 'divstyle'; //引用外部css

 oDiv.onmouseout=function(){run(num);}

 }

2、在php页面中引用js文件

 <head>

 <script type="text/javascript" src="demo.js"></script>

 </head>

3、调用添加div方法

 <?php

       $message=array("123","456","789");

         $count_json=count($message);//获取数组长度，添加相应div

         for ($i = 0; $i < $count_json; $i++)

            {

                  $meg =$message[$i];

                  //调用JavaScript方法，传递参数值

              echo "<script type='text/javascript'>cDiv($meg);</script>";

            }

 ?>

JavaScript 动态添加div 绑定点击事件的更多相关文章

  1. 【前端】vue2.x 配合 bootstrapTable 动态添加元素和绑定点击事件，事件无效 解决

    背景: 使用bootstrap-table 表格插件时,每一行的最后一班会加操作按钮列.如果不加入vue的话,使用插件自己的列属性formatter:function(value, row, inde ...

  2. js动态添加Div

    利用JavaScript动态添加Div的方式有很多,在这次开发中有用到,就搜集了一下比较常用的. 一.在一个Div前添加Div <html> <body> <div id ...

  3. JQuery 动态加载 HTML 元素时绑定点击事件无效问题

    问题描述 假设项目中有一个列表页面,如下: 当点击列表一行数据可以显示详情页面,而详情页面的数据是根据当前行的数据作为参数,通过 ajax 请求到后台返回的数据,再根据返回的结果动态生成 html 页 ...

  4. 动态添加div及对应的js、css文件

    动态添加div及对应的js.css文件 在近期的项目开发中需要在首页中添加很多面板型的div,直接加载代码显得很繁琐,于是利用js封装一个动态添加div及其对应css文件和js文件的方法供大家参考使用 ...

  5. 解决jQuery ajax动态新增节点无法触发点击事件的问题

    在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...

  6. javascript动态添加效果

    <script type="text/javascript"> window.onload=function(){ $("#ch").click(f ...

  7. 通过jQuery给<li>绑定点击事件

    背景:有个需求需要js中实现li标签的事件绑定,li通过在ajax请求中动态添加,按照常理,使用jQuery,可以使用以下方法绑定点击事件: $(function(){  commonAjaxCall ...

  8. 用Javascript动态添加删除HTML元素实例 (转载)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 【javascript 动态添加数据到 HTML 页面】

    今天简单的学习了一下有关对象字面量的定义和 javascript 如何取出对象字面量的值的知识,javascript 动态添加数据到 HTML 页面的问题. [学习目标]有如下的一组数据通过 Ajax ...

随机推荐

  1. jQ小图标上下滑动特效

    嗯,又到了,夜静饥寒的时候,手指颤抖,回望去,屋内满是寂静,寥寥绰影,咳咳咳,想我程序员之路还没到终点...就...咳咳咳 好了日常神经结束,还要涂我的唇膏.还剩下,最后一章,js动画(四),明天放上 ...

  2. CI Weekly #12 | 微信小程序的自动化测试进阶

    岁末将至,站在年终冲刺的尾巴上,flow.ci 新增了个人和团队设置的功能: 上线团队功能,注册时默认创建一个与用户名一致的团队,可设置:团队名称.增减团队成员,后续会不断完善: 增加个人设置,可修改 ...

  3. PowerDesigner如何把建好的表导入到数据库中，并且把注释也导入进去

    第一次接触这个软件,经过自己的捣鼓和百度,终于可以顺利的导入数据库中了,好开森,希望可以帮助到更多人. 数据库(mysql)其实和sqlserver差不多,以16.5版本为例 1.选中一个PDM项目, ...

  4. MySQL 存储表情字符

    摘要 在 MySQL 中直接存储表情的时候,会出现无法插入数据的错误. 这是由于一般情况下,MySQL 的字符集是 utf8,而对于 emoji 表情的 mysql 的 utf8 字符集是不支持,需要 ...

  5. WinForm DataGridView控件、duck布局

    1.DataGridView控件 显示数据表 (1)后台数据绑定: List<xxx> list = new List<xxx>(); dataGridView1.DataSo ...

  6. We Chall-Prime Factory-Writeup

    MarkdownPad Document html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,ab ...

  7. salesforce 零基础学习（六十六）VF页面应善于使用变量和函数（二）常用函数的使用

    上一篇介绍VF中常用的变量,此篇主要内容为VF页面可以直接使用的函数,主要包括Date相关函数,Text相关函数,Information相关函数以及logic相关函数,其他相关函数,比如math相关函 ...

  8. java 文件操作 写入和读取（小结一）

    参考了这篇博客并优化,谢谢:http://blog.sina.com.cn/s/blog_99201d890101b4le.html 功能:  实现通过两个类完成先写入文件,再读取数据计算显示 pac ...

  9. esri-leaflet入门教程（4）-加载各类图层

    esri-leaflet入门教程(4)-加载各类图层 by 李远祥 在leaflet中图层一般分为底图(Basemap)和叠加图层(Overlay).前面章节已经介绍过底图其实也是实现了TileLay ...

  10. 【android开发笔记】为Button的背景图片添加边框式样式效果

    现在做的项目遇到一个问题,设计给过来的图片只有一种状态,但是实现的需求是要求有两个状态,另一种选状态为图片背景加边框.如图: 刚开使用使用ImageView ,ImageViewButton 效果不是 ...