JS/JQ控制操作由JS/JQ创建生成的元素
在JQ/JS操作由JQ/JS创建的元素时，需要将操作function放入JS创建元素里面，如放在外面，可能无法操作，由于浏览器从上而下加载代码，在操作创建元素之前，该元素并不存在，而操作JS已经存在，将导致无法找到元素！
放入创建元素之内，在创建元素之后创建操作代码，即可找到创建的元素！
举个例子：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>JS/JQ控制操作由JS/JQ创建生成的元素</title>
<script type="text/javascript" src="https://blog.32xp.com/wp-content/themes/Eson.X.Blog.V1.1.0/img/js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="text">点击创建内容</div>
<div id="show"></div>
<script type="text/javascript">
$("#text").click(function(){
$("#show").html('<div id="a" style="padding:50px;">点击我将消失</div>');
});
$("#a").click(function(){
$("#a").remove();
});
</script>
</body>
</html>
以上这段代码，点击消失无效（无法移除#a的DIV）
正确代码：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>JS/JQ控制操作由JS/JQ创建生成的元素</title>
<script type="text/javascript" src="https://blog.32xp.com/wp-content/themes/Eson.X.Blog.V1.1.0/img/js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="text">点击创建内容</div>
<div id="show"></div>
<script type="text/javascript">
$("#text").click(function(){
$("#show").html('<div id="a" style="padding:50px;">点击我将消失</div>');
$("#a").click(function(){
$("#a").remove();
});
});
</script>
</body>
</html>
可以点击消失（可以移除#a的DIV）
在线运行代码测试：[outurl id=1]在线运行工具[/outurl]
发表评论
用户评论(0)
JS+html点击运行文本框内代码
代码类，代码演示类，代码修改等处使用，通过JS+Html表单输入框实现“点击运行”在浏览器中查看文本框内的代码运行效果。
JS代码：
function RunCode(txt) {
cod=document.all(txt)
var code=cod.value;
if (code!=“”){
var newwin=window.open(”,”,”); //打开一个窗口并赋给变量newwin。
newwin.opener = null // 防止代码对论谈页面修改
newwin.document.write(code); //向这个打开的窗口中写入代码code，这样就实现了运行代码功能。
newwin.document.close();
}else{
alert(“亲，对不起，您是要我运行什么啊！”); //空值时弹出
}
}
HTML代码：由一个文本框和一个点击完成
<textarea style=“width:990px;height:200px;margin:10px 0px 10px 10px;” id=“code”>
</textarea >
<div class=“run” onclick=“RunCode(‘code’)”>点击运行-查看效果</div>
点击之后就可以在浏览器中看待文本框内的效果！
演示：https://demo.32xp.com/runcode.html
代码
·
JS逐条向上滚动代码
JS逐条向上滚动代码，这种效果，或许现在都很少用到了。原理是复制层向上滚动。
CSS:
.box{font-size:14px;text-align:left;overflow:hidden;height:30px;line-height:30px;width:200px;border:1px solid #e4e4e4;}
.box ul{margin:0px;overflow:hidden;width:300px;}
.box li{ list-style-type:none; }
.box a{height:30px;width:350px;line-height:30px;overflow:hidden;}
HTML：
<div class=“box” id=“marqueebox”>
<ul>
<li><a href=“https://www.32xp.com” target=“_blank”>第一条</a></li>
<li><a href=“https://www.32xp.com” target=“_blank”>第二条</a></li>
<li><a href=“https://www.32xp.com” target=“_blank”>第三条</a></li>
<li><a href=“https://www.32xp.com” target=“_blank”>第四条</a></li>
</ul>
</div>
JS：
<script type=“text/javascript”>
function startmarquee(lh,speed,delay,index){
var t;
var p=false;
var o=document.getElementById(“marqueebox”);
o.innerHTML+=o.innerHTML;
o.onmouseover=function(){p=true}
o.onmouseout=function(){p=false}
o.scrollTop = 0;
function start(){
t=setInterval(scrolling,speed);
if(!p){ o.scrollTop += 1;}
}
function scrolling(){
if(o.scrollTop%lh!=0){
o.scrollTop += 1;
if(o.scrollTop>=o.scrollHeight/2) o.scrollTop = 0;
}else{
clearInterval(t);
setTimeout(start,delay);
}
}
setTimeout(start,delay);
}
startmarquee(30,30,3000,0);
</script>
演示：https://2.jspintu.sinaapp.com/dome/jsup.html
代码
·
WordPress评论表单添加验证码
上次看到朋友的博客，垃圾评论竟然上万条，这得多久没有进入后台？还是没有清理的习惯？
虽说，评论的用途似乎不是很大，WordPress现在折腾的人也少了吧。终究还是限制了一下评论，添加了一个验证码，且看下后续的效果
原本是想把验证码放在“提交评论”左侧的，但折腾了半天，还是不知道怎么放过来，测试了一些钩子，似乎也都不行。暂且先这样吧！
笔记
·
phpstorm 光标设置成细线
之前都是用NotePad++编辑代码，在群内看到很多人都在用PHPstorm编辑PHP，无所事事，就下载安装一个！
破解注册，汉化（汉化的不是很完整），花了不少时间！用下来感觉好的地方就是，不用再按Ctrl+S保存了，悬停会自动保存文件（只是还习惯上保存了一下）
设置鼠标成细线，好像百度了挺久的。最后是取消块状输入就解决了。Insert虽然能变细线，但是并不是常规的那种，会替换后面的字符，所以并不是想要的！
新版的设置方式是：File – Setting – Editor – Soft Wraps Soft-wrap files :
汉化版的是：取消块插入符
笔记
·
Zero零分
站龄13年资深站长
一个喜欢折腾，却又折腾不出像样东西的，不会PHP的PHP程序员！
394
文章 25
评论 26
分类 724
标签 4
友链
文章 25
评论 26
分类 724
标签 4
友链
还没有任何评论，你来说两句吧