JavaScript实现给按钮加上双重动作的方法

本文实例讲述了JavaScript实现给按钮加上双重动作的方法。分享给大家供大家参考。具体如下：

这里使用JavaScript给网页上按钮加入同时加入两个动作，一个是在文本框显示文字，另一个则是转向到某个网址，以往的按钮跳转都是单一的，这一个又在跳转时加入了将文字赋值给文本框的动作，搞懂了原理，就可以灵活运用了。

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-button-two-action-codes/

具体代码如下：

<title>JavaScript给按钮加上双重动作</title>
<script language=JavaScript>
function jdk1x() {
  var num1 = document.x.jdk.value;
  if(num1 == 'three') {
  document.x.jdk.value = document.x.jdk.value
    }
  else {
  document.x.jdk.value = "我们欢迎您！"
    }
location="http://www.jb51.net/"
 }
 </script>
<form name=x>
<input type=button value="我们" onClick="jdk1x()"><br>
<input type=text name=jdk width="300" onChange="document.x.jdk.value=''; return true">
</form>

希望本文所述对大家的javascript程序设计有所帮助。

赞 (0)

相关推荐

  • JavaScript实现点击单选按钮改变输入框中文本域内容的方法

    JavaScript实现点击单选按钮改变输入框中文本域内容的方法

    本文实例讲述了JavaScript实现点击单选按钮改变输入框中文本域内容的方法.分享给大家供大家参考.具体如下: 这里实现点击单选按钮改变输入框中文本域内容的方法,是一个JavaScript 的简单应用,可以减少用户的输入,提升用户操作易用性,它类似一个TAB选项卡一样的功能,并可以完成后提交表单,值得学习. 运行效果截图如下: 具体代码如下: <html> <head> <title>JavaScript点击单选框改变输入框内容</title> </

  • JavaScript给按钮绑定点击事件（onclick）的方法

    本文实例讲述了JavaScript给按钮绑定点击事件(onclick)的方法.分享给大家供大家参考.具体分析如下: 我们可以通过设定按钮的onclick属性来给按钮绑定onclick事件 <!DOCTYPE html> <html> <head> <script> function displayDate() { document.getElementById("demo").innerHTML=Date(); } </script

  • javascript实现表单提交后，提交按钮不可用的方法

    本文实例讲述了javascript实现表单提交后,提交按钮不可用的方法.分享给大家供大家参考.具体如下: 这里使用javascript控制表单提交后,提交按钮不可用,可以防止用户多次提交. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>表单提交后按钮禁用</title> &l

  • javascript实现点击单选按钮链接转向对应网址的方法

    javascript实现点击单选按钮链接转向对应网址的方法

    本文实例讲述了javascript实现点击单选按钮链接转向对应网址的方法.分享给大家供大家参考.具体如下: 这里实现一个按钮特效,当点击复选择框按钮的时候,激活链接,跳转到某网址,这里主要是由onClick派生出来的一些功能,然后配合函数你可以编写出更多的按钮特效来. 运行效果截图如下: 具体代码如下: <html> <head> <title>点击文本框激活链接转向某网址</title> <SCRIPT> function go(loc) {

  • Javascript 实现复制（Copy）动作方法大全

    一.实现点击按钮,复制文本框中的的内容 <script type="text/javascript"> function copyUrl2() { var Url2=document.getElementById("biao1"); Url2.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 alert("已复制好,可贴粘."); } <

  • javascript实现点击后变换按钮显示文字的方法

    本文实例讲述了javascript实现点击后变换按钮显示文字的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>显示一些按钮,如果点击了, 当前点击的按钮文本变为"点了",其他按钮文本变为"没点"</title> <script type="text/javascript

  • JavaScript实现自动消除按钮功能的方法

    JavaScript实现自动消除按钮功能的方法

    本文实例讲述了JavaScript实现自动消除按钮功能的方法.分享给大家供大家参考.具体如下: 这里使用JavaScript自动消除前项显示的内容,在网页特定方位显示内容,第一个按钮可用,但第二个在第一个点击之后就不能用了,如果想让第二个按钮起作用,你需要对其进行功能消除,如本示例代码就实现这样一种功能. 运行效果如下图所示: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

  • JavaScript获取按钮所在form表单id的方法

    本文实例讲述了JavaScript获取按钮所在form表单id的方法.分享给大家供大家参考.具体如下: 这里使用javascript获取form表单按钮的id,可以通过下面的JS代码获取. <!DOCTYPE html> <html> <body> <h1>www.sharejs.com</h1> <form id="form1"> <button id="button1" type=&q

  • javascript实现点击提交按钮后显示loading的方法

    本文实例讲述了javascript实现点击提交按钮后显示loading的方法.分享给大家供大家参考.具体如下: 这里可以实现点击提交按钮后显示loading,防止用户重复提交 <style> #loading { position:absolute; width:500px; height:50px; top:50%; left:50%; margin: -25px -150px; background-color:#FFFFFF; border:1px solid #CCCCCC; text

  • JavaScript实现给按钮加上双重动作的方法

    JavaScript实现给按钮加上双重动作的方法

    本文实例讲述了JavaScript实现给按钮加上双重动作的方法.分享给大家供大家参考.具体如下: 这里使用JavaScript给网页上按钮加入同时加入两个动作,一个是在文本框显示文字,另一个则是转向到某个网址,以往的按钮跳转都是单一的,这一个又在跳转时加入了将文字赋值给文本框的动作,搞懂了原理,就可以灵活运用了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-button-two-action-codes/ 具体代码如下: <title>

  • JavaScript中为元素加上name属性的方法

    今天遇到个小问题, 在构建 DOM 时, IE 中不能通过 element.setAttribute('name', _variable); 和 element.name = _variable; 这样的形式来为元素加上 name 属性, 无论是 IE6 还是 IE7. (IE8 是可以的, 但 IE8rc1 不行) 后来我查看了 MSDN, 得到信息如下: 复制代码 代码如下: Internet Explorer 8 and later can set the NAME attribute a

  • javascript实现十秒钟后注册按钮可点击的方法

    本文实例讲述了javascript实现十秒钟后注册按钮可点击的方法.分享给大家供大家参考.具体分析如下: 1.注册按钮初始状态为不可用,disabled 2.启动定时器,setInterval,1秒钟运行一次CountDown方法,设定一个初始值为10的全局变量,  在CountDown方法中对全局变量倒数,然后将倒数的值写到注册按钮上(请仔细阅读协议(还剩8秒)). 3.直到全局变量的值<=0,就让注册按钮可用,将按钮的文本设置为"同意!" <html xmlns=&qu

  • JavaScript实现点击按钮切换网页背景色的方法

    JavaScript实现点击按钮切换网页背景色的方法

    本文实例讲述了JavaScript实现点击按钮切换网页背景色的方法.分享给大家供大家参考,具体如下: 这里演示JavaScript用按钮随意变换背景颜色,每点击一下按钮,就可以随机改变一种网页背景颜色.颜色值事先是保存在JS的数组里,你在代码里会发现他们,若不想要某个颜色,就替换掉即可. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-btn-click-rand-bgcolor-codes/ 具体代码如下: <!DOCTYPE HTML

  • JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)

    新学习JavaScript,就碰到这么一个需求,几乎网上的方法都试过了.写出了总结下 使用的方法:clipboard 插件下载地址:https://github.com/zenorocha/clipboard.js/tree/master 引入插件:目录\clipboard.js-master\dist\clipboard.min.js 目录中有各种demo,分别实现了固定的文字复制,input的复制等等,可以看下找找思路: 下边来记录下使用的方式: 一:引入插件: <script src=&quo

  • JavaScript判断按钮被点击的方法

    废话不多说了,直接给大家贴代码了. firfox版: <HTML> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <HEAD> <TITLE></TITLE> <script> document.onclick=function(e){ var evt=e||window.event; var tar=

  • JavaScript点击按钮后弹出透明浮动层的方法

    本文实例讲述了JavaScript点击按钮后弹出透明浮动层的方法.分享给大家供大家参考.具体分析如下: 这里实现点击后页面变灰色,并用JS弹出一个居中的浮动层提示窗口,这个窗口是透明的,可以设置透明度,网上已经有很多类似的JavaScript代码,你可以借鉴一下. <HTML> <HEAD> <TITLE>浮动层居中的对话框效果演示</TITLE> <META http-equiv=Content-Type content="text/htm

  • JavaScript实现重力下落与弹性效果的方法分析

    JavaScript实现重力下落与弹性效果的方法分析

    本文实例讲述了JavaScript实现重力下落与弹性效果的方法.分享给大家供大家参考,具体如下: 这里利用JS语言在Html页面中实现重力作用下落地后弹起的效果,如下所示: 在此例中主要涉及以下几个问题: 1.给球体一个释放初速度,如何实现越向下运动且在接触边缘之前,竖直方向上的速度speedY越大的效果? 答案:可以在计时器中,每及时一次,竖直方向上的速度speedY自增一个固定值来实现,下面代码中speedY += 6;就是实现这个效果. 2.球体接触地面(此例中指浏览器下边缘)后,如何实现

  • AngularJS实现在ng-Options加上index的解决方法

    本文实例讲述了AngularJS实现在ng-Options加上index的解决方法.分享给大家供大家参考,具体如下: Angularjs交流群中有位童学问道如何为Angular select的ng-Options像Angularjs的ng-Repeat一样加上一个索引$index. 其实对于这个问题来说Angular本身并未提供$index之类的变量供使用.但是也不是说对于这个问题我们就没有解决方案. 把这个问题换成角度来看,我们所需要的就是js数组的下标,所以我们如果我们能够在对象上加入下标,

随机推荐