精华内容
下载资源
问答
  • <div class="post-text" itemprop="text"> <p>I have a list in my site, and when I click each of the list items, I want the div next to them to reload with ajax, so as not to reload the whole page. ...
  • 之前做了一个可编辑div需要里面插入内容,搜了好多代码,就这个能实现我的功能,记录一下,以备以后用 &lt;!DOCTYPE HTML&gt; &lt;html&gt; &lt;head&gt; &lt;meta ...

    之前做了一个可编辑div需要在里面插入内容,搜了好多代码,就这个能实现我的功能,记录一下,以备以后用

    <!DOCTYPE HTML>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
        <title>UMEDITOR 简单功能</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <script type="text/javascript" src="../third-party/jquery.min.js"></script>
    </head>
    <body>
     
        <h1>UMEDITOR 简单功能</h1>
    	<script type="text/javascript">
    		$(function(){
    			$("#myEditor").focus(function(){
    		    	$("#myEditor").removeClass("flag");
    		    });
    		    /* $("#myEditor").blur(function(){
    		    	$("#myEditor").addClass("flag");
    		     }); */
    		});
    	
       		function add(){ 
       		 insertHTML("<input type='text' disabled />"); 
       		}
       		
       		 //再加入一个全屏事件  
       		     $(window).click(function(e)  
       		          {  
       		            if (window.getSelection)  
       		            {  
       		                 var getevent=e.srcElement?e.srcElement:e.target;//不要告诉我不知道这句的意思  
       		              //console.log(getevent.id,getevent.tagName);
       		                if(getevent.id!=null && getevent.id=="cmdInsert"||getevent.id=="myEditor")  
       		                {  
       		                	//alert(0);
       		                	//代表 点了插入html的按钮  
       		                    //则不执行getFocus方法  
       		                 }  
       		                else  
       		                	$("#myEditor").addClass("flag");//除非点了那个插入html的按钮 其他时候必须要执行getFocus来更新最后失去焦点的div  
       		            }  
     
       		          }) 
       		
       		       
       		function insertHTML(html)  
            {  
                var dthis=$("#myEditor")[0];//要插入内容的某个div,在标准浏览器中 无需这句话  
                //dthis.focus();
                 var sel, range; 
                 console.log($(dthis).hasClass("flag"));
                 if($(dthis).hasClass("flag")){
                	 $(dthis).html(dthis.innerHTML+html);
                	 return;
                 }
                 if (window.getSelection)  
                  {  
                         // IE9 and non-IE  
                         sel = window.getSelection();  
                         if (sel.getRangeAt && sel.rangeCount) {  
                         range = sel.getRangeAt(0);  
                         range.deleteContents();  
                         var el = document.createElement('div');  
                         el.innerHTML = html;  
                         var frag = document.createDocumentFragment(), node, lastNode;  
                         while ( (node = el.firstChild) )  
                          {  
                             lastNode = frag.appendChild(node);  
                          }  
     
                     range.insertNode(frag);  
                         if (lastNode) {  
                         range = range.cloneRange();  
                         range.setStartAfter(lastNode);  
                         range.collapse(true);  
                         sel.removeAllRanges();  
                         sel.addRange(range);  
                         }  
                        }  
                 }   
                 else if (document.selection && document.selection.type !='Control')   
                 {  		
                     $(dthis).focus(); //在非标准浏览器中 要先让你需要插入html的div 获得焦点  
              	ierange= document.selection.createRange();//获取光标位置  
                     ierange.pasteHTML(html);    //在光标位置插入html 如果只是插入text 则就是fus.text="..."  
                     $(dthis).focus();      
     
                 }  
            }  	
    	</script>
    	<button onclick="add()" id="cmdInsert" style="border: none;background-color: #fff;">增加节点</button>
        <div id="myEditor" class="flag" style="position:absolute;width:800px;height:240px;border:1px;border-color: red;background-color: #f5f5f5" contenteditable="true">
        	
        </div>
    	
    </body>
    </html>
    

     

    展开全文
  • 之前做了一个可编辑div需要里面插入内容,搜了好多代码,就这个能实现我的功能,记录一下,以备以后用 <!DOCTYPE HTML> <html> <head> <meta ...

     之前做了一个可编辑div需要在里面插入内容,搜了好多代码,就这个能实现我的功能,记录一下,以备以后用

    <!DOCTYPE HTML>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
        <title>UMEDITOR 简单功能</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <script type="text/javascript" src="../third-party/jquery.min.js"></script>
    </head>
    <body>
    
        <h1>UMEDITOR 简单功能</h1>
    	<script type="text/javascript">
    		$(function(){
    			$("#myEditor").focus(function(){
    		    	$("#myEditor").removeClass("flag");
    		    });
    		    /* $("#myEditor").blur(function(){
    		    	$("#myEditor").addClass("flag");
    		     }); */
    		});
    	
       		function add(){ 
       		 insertHTML("<input type='text' disabled />"); 
       		}
       		
       		 //再加入一个全屏事件  
       		     $(window).click(function(e)  
       		          {  
       		            if (window.getSelection)  
       		            {  
       		                 var getevent=e.srcElement?e.srcElement:e.target;//不要告诉我不知道这句的意思  
       		              //console.log(getevent.id,getevent.tagName);
       		                if(getevent.id!=null && getevent.id=="cmdInsert"||getevent.id=="myEditor")  
       		                {  
       		                	//alert(0);
       		                	//代表 点了插入html的按钮  
       		                    //则不执行getFocus方法  
       		                 }  
       		                else  
       		                	$("#myEditor").addClass("flag");//除非点了那个插入html的按钮 其他时候必须要执行getFocus来更新最后失去焦点的div  
       		            }  
    
       		          }) 
       		
       		       
       		function insertHTML(html)  
            {  
                var dthis=$("#myEditor")[0];//要插入内容的某个div,在标准浏览器中 无需这句话  
                //dthis.focus();
                 var sel, range; 
                 console.log($(dthis).hasClass("flag"));
                 if($(dthis).hasClass("flag")){
                	 $(dthis).html(dthis.innerHTML+html);
                	 return;
                 }
                 if (window.getSelection)  
                  {  
                         // IE9 and non-IE  
                         sel = window.getSelection();  
                         if (sel.getRangeAt && sel.rangeCount) {  
                         range = sel.getRangeAt(0);  
                         range.deleteContents();  
                         var el = document.createElement('div');  
                         el.innerHTML = html;  
                         var frag = document.createDocumentFragment(), node, lastNode;  
                         while ( (node = el.firstChild) )  
                          {  
                             lastNode = frag.appendChild(node);  
                          }  
    
                     range.insertNode(frag);  
                         if (lastNode) {  
                         range = range.cloneRange();  
                         range.setStartAfter(lastNode);  
                         range.collapse(true);  
                         sel.removeAllRanges();  
                         sel.addRange(range);  
                         }  
                        }  
                 }   
                 else if (document.selection && document.selection.type !='Control')   
                 {  		
                     $(dthis).focus(); //在非标准浏览器中 要先让你需要插入html的div 获得焦点  
              	ierange= document.selection.createRange();//获取光标位置  
                     ierange.pasteHTML(html);    //在光标位置插入html 如果只是插入text 则就是fus.text="..."  
                     $(dthis).focus();      
    
                 }  
            }  	
    	</script>
    	<button οnclick="add()" id="cmdInsert" style="border: none;background-color: #fff;">增加节点</button>
        <div id="myEditor" class="flag" style="position:absolute;width:800px;height:240px;border:1px;border-color: red;background-color: #f5f5f5" contenteditable="true">
        	
        </div>
    	
    </body>
    </html>



     

    转载于:https://www.cnblogs.com/Allen0910/p/6506246.html

    展开全文
  • 如何div中内容垂直居中 第一种方法: 在div里面添加:text-align:center; line-height: 60px; 这里的line-height是行高,这个根据你的div的高度要调一下。 第二种方法: 就是改变div的属性,让其display属性为...

    如何将div中的内容垂直居中

    第一种方法:
    在div里面添加:text-align:center; line-height: 60px;
    这里的line-height是行高,这个根据你的div的高度要调一下。
    第二种方法:
    就是改变div的属性,让其display属性为table-cell,我们知道table单元格中可以通过vertical-align垂直居中,转化后也可以用此属性,
    在div里面添加:display:table-cell; vertical-align: middle;
    综上所述,将div的内容垂直居中主要2种方式,第一种是设置line-height,第二种是设置display为table-cell

    展开全文
  • <div class="post-text" itemprop="text"> <p>I need to clear the <code><div></code> and insert new content I get from the database after each while loop in ...
  • <div class="post-text" itemprop="text"> <p>I would like to fill a dynamicly input in my gravity form but i don't get why this is not working. I have 3 "random" input type, which works, but i would ...
  • <div class="post-text" itemprop="text"> <p>Hi i m working on content template module in drupal,but there is problem in showing view of ranking field with below coding <pre><code><td width="10%...
  • 目录 1.前言 2.解决方法(flex布局) 1.前言 参考:https://www.cnblogs.com/xiaocaiyuxiaoniao/p/10407830.html...该方法主要是通过在div添加下面三个css属性,这样div就实现了垂直水平居中。 .sxzyjv{ ...

    目录

    1.前言

    2.解决方法(flex布局)


    1.前言

    参考:https://www.cnblogs.com/xiaocaiyuxiaoniao/p/10407830.html上面这篇文章中记录了6中方法大家可自行参考。

    2.解决方法(flex布局)

    该方法主要是通过在div上添加下面三个css属性,这样div就实现了垂直水平居中。

    .sxzyjv{
                    display: flex;
                    align-items: center;/* 垂直居中 */
                    justify-content: center;/*水平居中 */
     }

    下面我提上代码,大家自行查看

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title></title>
    		<script src="../js/main-public.js"></script>
    		<style>
    			html,body{
    				padding: 0rem;
    				margin: 0rem;
    			}
    			.sxzyjv{
    				display: flex;
    				align-items: center;/* 垂直居中 */
    				justify-content: center;/*水平居中 */
    			}
    			.aaa{
    				width: 100%;
    				height: 5rem;
    				overflow:hidden ;
    				background-color: red;
    			}
    			.bbb{
    				width: 2rem;
    				height: 2rem;
    				background-color: green;
    			}
    			.bbb img{
    				width: 1rem;
    				height: 1rem;
    			}
    		</style>
    	</head>
    	<body>
    		<div class="aaa sxzyjv">
    			<div class="bbb sxzyjv">
    			</div>
    		</div>
    	</body>
    </html>
    

     

     

    展开全文
  • 如何div中的文字居中

    千次阅读 2016-07-24 16:57:01
    首先定义一个类名为box的div容器,直接其内部添加文字 以下代码适用单行文字容器居中对齐 .box{ height:50px; width:50px; text-align:center; //设置文字水平居中 line-height:50px; //设置垂直方向...
  • 一个主页有一个嵌套的Div内容上面添加一个关闭功能可以关闭这个div嵌套内容,不关闭当前主页,如何做,求各位大神帮帮忙[img=https://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/1.gif][/...
  • <div class="post-text" itemprop="text"> <p>I am trying to add an inline image to an email sent using the <strong>mailgun</strong> api using only the contents of the image file. <p>As far as i ...
  • 工作评论内容测试遇到评论着的评论内容为:“dddddddddddddddddddddddddddddddddddddddddddddddddd”,错误的评论,显示评论列表的时候因为有固定宽,但是显示的内容超出的了div的宽,这种情况下我们需要...
  • <div class="post-text" itemprop="text"> <p>I am looking for the correct way to add radio gender option in woocommerce edit account page and use it for displaying specific content based on the ...
  • <div class="post-text" itemprop="text"> <p>Can someone tell me how to change my code to work with get_the_content() function? I was trying to change "the_content" to "get_the_content", but it's not...
  • html在div中显示滚动条

    2019-10-08 09:45:38
    基本思路:滚动条要添加内容部分的父标签上(div),内容部分不设置大小,父标签要明确设置大小,并且父标签要添加overflow样式,并设置成auto。 打开的效果如下: 这时可能有人会问,父div的长度和宽度...
  • htmldiv添加滚动条

    千次阅读 2014-12-22 10:22:38
    无标题文档 .css{ width:50px; border:1px solid red; /* overflow-x:scroll;... overflow属性: 检索或设置当对象的内容超过其指定高度及宽度时如何显示内容 ... 需要时内容会自动添加滚动条 overflow:
  • DIV+CSS如何让图片和文字同一行

    万次阅读 2018-11-21 13:55:03
    在div+css布局,如果一行(或一个DIV)内容中有图片和文字的话,图片和文字往往会一个在上一个在下,这是一个新手都会遇到问题,我的解决方法有三: 1.添加CSS属性:vertical-align:middle; 代码: &amp;lt;...
  • DIV+CSS如何让图片和文字同一行!

    千次阅读 2019-07-18 11:23:57
    在div+css布局,如果一行(或一个DIV)内容中有图片和文字的话,图片和文字往往会一个在上一个在下,这是一个新手都会遇到问题,我的解决方法有三: 1.添加CSS属性:vertical-align:middle; 代码:<style> a...
  • 应该如何布局会更加完美呢,比如要保证布局完成的情况下,可以快速的添加一个元素依然保持这样的布局。以及当出现第二行的时候,这样的布局依然能够不受影响。又不用修改太多的内容。设置宽为100%和块元素的默认...
  • 应该如何布局会更加完美呢,比如要保证布局完成的情况下,可以快速的添加一个元素依然保持这样的布局。以及当出现第二行的时候,这样的布局依然能够不受影响。又不用修改太多的内容。设置宽为100%和块元素的默认...
  • 我们设计网页的时候,总会遇到一些不愉快的事情,最常见的莫过于后台添加内容后才发现显示的页面被撑开,导致网页极度不美观。以前大家基本上都是设计表格,网上自然不少对于的解决方法,如今还有div+css标准...
  • iview项目中添加echarts3

    千次阅读 2018-11-13 06:41:54
    前面 即将结束的iview项目中,用到了大量的echarts3内容,简要记录下,...页面模板中添加带 id 的 div 元素 <template> <div style="width:100%;height:100%;" id="chart-div"></div> ...

空空如也

空空如也

1 2 3 4 5 ... 14
收藏数 280
精华内容 112
关键字:

如何在div中添加内容