几种javascript

最新推荐文章于 2024-09-18 15:54:57 发布
最新推荐文章于 2024-09-18 15:54:57 发布
阅读量494 收藏
点赞数
分类专栏： jsp 文章标签： javascript input function class xhtml border
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/shidanwo77/article/details/6603613
版权

1

--------------------------------------------------------------------

<BODY>
<input type="file" name='a1'><input type="button" value='复制粘贴' οnclick="haha()"><div id="aa"></div>
<SCRIPT LANGUAGE="JavaScript">
<!--
function haha()
{
clipboardData.setData("Text",a1.value);
aa.innerText=clipboardData.getData("Text");
}
//-->
</SCRIPT>
</BODY>

--------------------------------------------------------------------

2

--------------------------------------------------------------------

<%@ page contentType="text/html; charset=gbk" %>
<html>
<style type="text/css">
<!--
td{border-left-style:solid; border-left-color:blue; border-left-width:1px;border-top-style:solid; border-top-color:blue; border-top-width:1px;}

-->
</style>


<script type="text/javascript" language="javascript">
function change(obj)
{
obj.style.borderLeftStyle ="solid";
obj.style.borderLeftWidth ="2";
obj.style.borderLeftColor ="blue";
obj.style.borderTopStyle ="solid";
obj.style.borderTopWidth ="2";
obj.style.borderTopColor ="blue";
}
function backstyle(obj)
{
obj
obj.style.borderLeftStyle ="solid";
obj.style.borderLeftWidth ="1";
obj.style.borderLeftColor ="blue";
obj.style.borderTopStyle ="solid";
obj.style.borderTopWidth ="1";
obj.style.borderTopColor ="blue";
}
</script>
<body>
<table border="0"  cellpadding="0" cellspacing="0" bgcolor="lightblue">

<tr>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >1</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >2222</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >33333</td>
</tr>
<tr >
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >44444</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >55555</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >66666</td>
</tr>
<tr>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >77777</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >88888</td>
<td onMouseOver="change(this)" class="" onMouseOut="backstyle(this)" >999999</td>
</tr>
</table>
</body>
</html>

 -----------------------------------------------------------------------------------------------

3

-----------------------------------------------------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<div class="block">
 
     <li>
      <img style="display:block;cursor:pointer;" src="http://home.blueidea.com/attachment/201106/2/498048_13070269434RZR_t.png" alt="on"       width="50" height="50" οnclick="onopen(this)"/>
 
      <ul>
   wwww
        <li>123132</li>
        <li>123132</li>
        <li>123132</li>
      </ul>
    </li>
</div>
<script type="text/javascript">
 function onopen(value)
 {
 if(value.parentNode.getElementsByTagName('ul')[0].style.display=='block')
 {
 value.parentNode.getElementsByTagName('ul')[0].style.display = 'none';
}
else
{
value.parentNode.getElementsByTagName('ul')[0].style.display = 'block';
}
}
</script>
</body>
</html>

 ----------------------------------------------------------------------------------------------

4

-----------------------------------------------------------------------------------------------
 
 

<html>


<body>

 


输入框景背景透明：
<input style="background:transparent;border:1px solid #ffffff">

鼠标划过输入框，输入框背景色变色：
<INPUT value="Type here" NAME="user_pass" TYPE="text" SIZE="29" οnmοuseοver="this.style.borderColor='black';this.style.backgroundColor='plum'"
style="width: 106; height: 21"
οnmοuseοut="this.style.borderColor='black';this.style.backgroundColor='#ffffff'" style="border-width:1px;border-color=black">

输入字时输入框边框闪烁(边框为小方型)：
<Script Language="JavaScript">
function borderColor(){
if(self['oText'].style.borderColor=='red'){
self['oText'].style.borderColor = 'yellow';
}else{
self['oText'].style.borderColor = 'red';
}
oTime = setTimeout('borderColor()',400);
}
</Script>
<input type="text" id="oText" style="border:5px dotted red;color:red" οnfοcus="borderColor(this);" οnblur="clearTimeout(oTime);">

输入字时输入框边框闪烁(边框为虚线)：
<style>
#oText{border:1px dotted #ff0000;ryo:expression(οnfοcus=function light (){with(document.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#ffee00");timer=setTimeout(light,500);}},οnblur=function(){this.style.borderColor="#ff0000";clearTimeout(timer)})};
</style>
<input type="text" id="oText">

自动横向廷伸的输入框：
<input type="text" style="huerreson:expression(this.width=this.scrollWidth)" value="abcdefghijk">

自动向下廷伸的文本框：
<textarea name="content" rows="6" cols="80" onpropertychange="if(this.scrollHeight>80) this.style.posHeight=this.scrollHeight+5">输入几个回车试试</textarea>

只有下划线的文本框：
<input style="border:0;border-bottom:1 solid black;background:;">

软件序列号式的输入框：
<script for="T" event="onkeyup">
if(value.length==3)document.all[event.srcElement.sourceIndex+1].select();
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T7" size="5" maxlength="3">

软件序列号式的输入框(完整版)：
<script for="T" event="onkeyup">if(value.length==maxLength)document.all[event.srcElement.sourceIndex+1].focus();</script>
<script for="T" event="onfocus">select();</script>
<script for="Submit" event="onclick">
var sn=new Array();
for(i=0;i<T.length;i++)
sn=T.value;
alert(sn.join("—"));
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">
<input type="submit" name="Submit">

 

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/luo_yifan/archive/2011/02/15/6185608.aspx
</body>
</html>

-------------------------------------------------------------------------------------------------------------------------------------

5

-------------------------------------------------------------------------------------------------------------------------------------
 

<html>
<head>
    <title></title>
    <script>
    function textEnable(obj){
    if(obj.checked)
    document.getElementById("text1").disabled=true;
    else
     document.getElementById("text1").disabled=false;
    }
    </script>
</head>

<body>
<input type="text" id="text1"/>
<input type="checkbox" id="cb" value="select" οnclick="textEnable(this);"/>
</body>
</html>

 --------------------------------------------------------------------------------------------------

6

---------------------------------------------------------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<style type="text/css">
table{ border-color:#0000FF; border-style:solid; border-width:1px}
</style>

<script type="text/javascript">
 var i=1;
function run(obj)
{
obj.style.width="500";
obj.style.height="500";

}
function backstyle(obj)
{
obj.style.width="40";
obj.style.height="60";

}
</script>

<body>
<table align="center">
<td>
<img src="img/100.jpg" οnmοusemοve="run(this)" οnmοuseοut="backstyle(this)" style="width:40px; height:60px;"/>

</td>
<td>
<img src="img/101.jpg" οnmοusemοve="run(this)" οnmοuseοut="backstyle(this)" style="width:40px; height:60px;"/>

</td>

<td>
<img src="img/102.jpg" οnmοusemοve="run(this)" οnmοuseοut="backstyle(this)" style="width:40px; height:60px;"/>
</td>
<td>
<img src="img/103.jpg" οnmοusemοve="run(this)" οnmοuseοut="backstyle(this)" style="width:40px; height:60px;" />
</td>

<tr>

 


</tr>


</table>

 

</body>
</html>

----------------------------------------------------------------------------------

7

----------------------------------------------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script type="text/javascript">
 var i=1;
function run()
{
var obj=document.getElementById("img");
obj.src="img/"+i+".gif";
i++;
if(i==15)
{i=1;}
}
</script>

<body>


<div style="width:50px; height:50px">
<img src="img/1.gif" id="img" οnclick="run(this)" />


</div>

 

<script type="text/javascript" language="javascript">
 setInterval("run()",1000);
</script>
</body>
</html>

--------------------------------------------------------------------------------

 8

-------------------------------------------------------------------------------

<html>
<head>
<script type="text/javascript" language="javascript">
function openpage()
{
window.open("2.html","newwindow","");
}
</script>
</head>
<body onLoad="openpage()">

</body>
</html>

---------------------------------------------------------------------------------

小幸运(●ˇ∀ˇ●)
关注
专栏目录
几种 JavaScript 动画库推荐
前端大全
04-11 7194
（点击上方公众号，可快速关注）英文：Bradley Nice   译文：Aceyclee   zhuanlan.zhihu.com/p/28645609简评：JavaScript 库对设计师和开发人员来说，都是非常有用的工具。它们可以为你的网站添加一些超级强大的功能，给用户带来更好的体验。1. AniJS.js基于 CSS3 的动画库2. Velocity.jsVelocity 是一个简单易用、高
JavaScript的几种循环方式
CSH_lucky的博客
12-09 3380
导言 我们在使用JavaScript时经常会遇到需要一遍一遍地运行相同代码，而这样不经浪费时间，还效率低下，使用循环是个明智的选择，大大提高了效率，也减少了代码量。 JS中循环有三种： 1.while循环 2.do-while循环 3.for循环 一、while循环 1、while循环的语法结构： while(条件表达式){当条件表达式为布尔值true时要执行的语句块} 2、while循环的应用 ...
JavaScript函数定义的几种方式
超人不会飞
06-27 2663
什么是函数呢？ 对于JS来说，我们可以把函数理解为任意一段代码放在一个盒子里，在我们想要让这段代码执行的时候，直接执行这个盒子里的代码就行。专业一点来讲：JavaScript 函数是被设计为执行特定任务的可以重复利用的代码块。 function fn (p1, p2) { return p1 * p2; // 该函数返回 p1 和 p2 的乘积 } javaScript 函数通过 function 关键词进行定义，其后是函数名和括号 ()。 1.函数声明： 必须有名字，会函数提升，在预解析阶段.
javascript
weixin_44654375的博客
02-15 475
-JavaScript 今日内容 使用JS完成图片轮播效果 使用JS完成页面定时弹出广告 使用JS完成表格的隔行换色 使用JS完成复选框的全选效果 使用JS完成省市联动效果 学习目标 使用JS可以获得指定元素 使用JS可以编写定时程序 使用JS可以创建元素 使用JS可以对元素的属性进行操作 使用JS可以对元素的标签体进行操作 使用JS可以对指定元素的样式进行操作（获得或修改） ...
JavaScript
qq_39582356的博客
08-21 157
概述 JavaScript：，属于 HTML 和 Web 的编程语言，基于对象和四件驱动的脚本语言。主要应用在客户端 特点： 交互性（信息动态交互） 安全性（不允许直接访问本地硬盘） 跨平台性（可以解释js的浏览器都可以执行） 与Java不同： JS基于对象，Java面向对象 JS只需解释即可以执行，Java需要先编译 JS弱类型，Java强类型 总结： HTML 定义网页的内容 CSS...
几种javascript的选项卡特效
12-29
本篇文章将深入探讨几种用JavaScript实现的选项卡特效及其背后的原理。 1. **基础切换效果** 基础的选项卡切换通常涉及HTML结构、CSS样式和JavaScript事件处理。HTML中，我们可以为每个选项卡和内容区域设置不同的...
javascript的几种写法总结
10-21
本文将总结几种常见的JavaScript写法，帮助读者更好地理解这门语言的多样性和表达能力。 首先，我们来探讨JavaScript变量的定义和使用。在JavaScript中，变量定义通常采用关键字var来声明。例如： ```javascript ...
Javascript中for循环语句的几种写法总结对比
10-20
以下是几种常见的for循环语句的总结对比： 1. **基础写法**： ```javascript for (var i = 0; i ; i++) { var a = arr[i]; // ... } ``` 这是最标准的for循环形式，适用于大多数情况。然而，这种方法每次...
Javascript调用函数方法的几种方式介绍
10-24
主要介绍了Javascript调用函数方法的几种方式介绍,本文讲解了func()、(function(arg){})(window)、func.bind(sth)()、func.call()、func.apply()等5种方式,需要的朋友可以参考下
Javascript 错误处理的几种方法
10-29
本文将探讨在JavaScript中实现错误处理的几种方法，并解释其中的原理。 首先，浏览器不会抛出Error类型的异常。这意味着，如果我们在JavaScript代码中捕获到一个Error类型的异常，我们可以确定这是由用户代码中抛出...
【JavaScript】LeetCode：707设计链表
weixin_45980065的博客
09-14 677
【代码】【JavaScript】LeetCode：707设计链表。
RedisTemplate混用带来的序列化问题
最新发布
咖啡煮码
09-18 442
RedisTemplate 不要乱用哦，否则极易出现序列化问题
JS的输出语句
J3259392566的博客
09-13 309
js中严格区分大小写。
八十多种证件识别接口-JavaScript身份证识别API示例-护照识别-户口页识别
weixin_41711744的博客
09-12 667
证件识别API包含了身份证识别、护照识别、户口页识别、港澳台来往通行证识别等八十多种证件识别类型，提供了快速、精准的证件信息提取功能，广泛应用于实名认证 、机场出入口等场景。身份证识别API常用于在线支付、金融服务、酒店入住等需要进行实名认证和提取身份信息的场景。在这些场景中，通过快速识别和验证身份证信息，可以有效提高处理速度，减少人为错误，增强安全性。八十多种证件识别接口提供了一种高效、精准的识别方式来读取各类证件信息，通过合理应用这些技术，可以大幅提升用户体验和企业运营效率。
echarts饼图内容循环播放实现
qq_39877681的博客
09-12 341
echarts饼图内容循环播放实现
计算机毕业设计 基于SpringBoot的课程教学平台的设计与实现 Java+SpringBoot+Vue 前后端分离 文档报告 代码讲解 安装调试
weixin_19164791635
09-12 974
本文介绍了一款基于Java、SpringBoot和Vue.js技术的课程教学平台。该平台服务于管理员、学生和教师，提供教学资源管理、课程信息浏览、作业提交与批改等功能，旨在优化教学流程，提升教育质量，促进教育资源的数字化共享，推动教育信息化发展。
计算机毕业设计 网上书店系统 Java+SpringBoot+Vue 前后端分离 文档报告 代码讲解 安装调试
weixin_19164791635
09-16 1229
本文介绍了一款基于Java、SpringBoot和Vue.js技术的网上书店系统。该系统为管理员、用户和卖家提供了图书信息浏览、订单管理、个人中心管理等功能，旨在打造一个便捷、高效的在线购书平台。系统通过优化图书销售流程，提升用户体验，推动出版行业的数字化转型，促进知识传播和文化交流。
在子组件中使用props用于在父组件中给子组件变量设置值
ithongchou的博客
09-13 199
/传给父组件传值到此组件。
Echarts实现温度计条形图
weixin_72439307的博客
09-14 208
echart温度计
javascript有几种继承方式
04-29
在JavaScript中，有以下几种继承方式： 1. 原型链继承：利用原型链实现继承。缺点是子类不能向父类构造函数传递参数。 2. 构造函数继承：在子类的构造函数中调用父类构造函数，并使用call或apply方法将父类的属性...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值