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


Posted in Javascript onAugust 14, 2015

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

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

运行效果截图如下:

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

在线演示地址如下:

具体代码如下:

<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="https://3water.com/"
 }
 </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程序设计有所帮助。

Javascript 相关文章推荐
兼容FireFox 的 js 日历 支持时间的获取
Mar 04 Javascript
学习从实践开始之jQuery插件开发 菜单插件开发
May 03 Javascript
jquery动态增加text元素以及删除文本内容实例代码
Jul 01 Javascript
Javascript基础教程之switch语句
Jan 18 Javascript
node.js操作mongodb学习小结
Apr 25 Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 Javascript
微信小程序  http请求封装详解及实例代码
Feb 15 Javascript
babel之配置文件.babelrc入门详解
Feb 22 Javascript
轻量级JS Cookie插件js-cookie的使用方法
Mar 22 Javascript
vue项目打包后打开页面空白解决办法
Jun 29 Javascript
Vue表单demo v-model双向绑定问题
Jun 29 Javascript
vue 属性拦截实现双向绑定的实例代码
Oct 24 Javascript
详解jQuery中的元素的属性和相关操作
Aug 14 #Javascript
js实现人才网站职位选择功能的方法
Aug 14 #Javascript
jQuery入门基础知识学习指南
Aug 14 #Javascript
Jquery全选与反选点击执行一次的解决方案
Aug 14 #Javascript
js实现Select列表各项上移和下移的方法
Aug 14 #Javascript
innerHTML中标签可以换行的方法汇总
Aug 14 #Javascript
jQuery编程中的一些核心方法简介
Aug 14 #Javascript
You might like
php 抽象类的简单应用
2011/09/06 PHP
PHP gbk环境下json_dencode传送来的汉字
2012/11/13 PHP
深入解析php中的foreach函数
2013/08/31 PHP
PHP设计模式之状态模式定义与用法详解
2018/04/02 PHP
ThinkPHP框架实现的MySQL数据库备份功能示例
2018/05/24 PHP
用tip解决Ext列宽度不够的问题
2008/12/13 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
2013/11/22 Javascript
单击和双击事件的冲突处理示例代码
2014/04/03 Javascript
js数组方法扩展实现数组统计函数
2014/04/09 Javascript
JQuery中serialize()用法实例分析
2015/02/06 Javascript
JS实现很酷的EMAIL地址添加功能实例
2015/02/28 Javascript
Bootstrap每天必学之表格
2015/11/23 Javascript
微信小程序 网络API Websocket详解
2016/11/09 Javascript
node.js缺少mysql模块运行报错的解决方法
2016/11/13 Javascript
微信小程序开发(二)图片上传+服务端接收详解
2017/01/11 Javascript
angularJS深拷贝详解
2017/03/23 Javascript
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
一秒学会微信小程序制作table表格
2019/02/14 Javascript
vue获取时间戳转换为日期格式代码实例
2019/04/17 Javascript
JavaScript剩余操作符Rest Operator详解
2019/07/20 Javascript
Nuxt.js实现一个SSR的前端博客的示例代码
2019/09/06 Javascript
webpack安装配置与常见使用过程详解(结合vue)
2020/06/01 Javascript
使用js和canvas实现时钟效果
2020/09/08 Javascript
JavaScript代码简化技巧实例解析
2020/09/09 Javascript
JS实现选项卡插件的两种写法(jQuery和class)
2020/12/30 jQuery
Django1.7+python 2.78+pycharm配置mysql数据库教程
2014/11/18 Python
[原创]Python入门教程4. 元组基本操作
2018/10/31 Python
Python实现壁纸下载与轮换
2020/10/19 Python
Python命令行参数argv和argparse该如何使用
2021/02/08 Python
Pop In A Box英国:Funko POP搪胶公仔
2019/05/27 全球购物
IBatis持久层技术
2016/07/18 面试题
创业计划实施的7大步骤
2014/02/05 职场文书
遥感技术与仪器求职信
2014/02/22 职场文书
教师新年寄语
2014/04/03 职场文书
MySQL 覆盖索引的优点
2021/05/19 MySQL
用python修改excel表某一列内容的操作方法
2021/06/11 Python