3-3 编程练习

完善下面的代码，在input框中输入内容的时候同样显示在下面的p标签中

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>习题</title>

</head>

<body>

    <input type="text" value="">

    <p></p>

    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>

    <script>

    //此处写代码

    </script>

</body>

</html>

任务

1、选中input元素

2、使用键盘事件，将input框中的内容添加到p标签中

任务提示

val()方法返回或者设置被选元素的值，获取输入框中的内容可以使用val()

参考代码

$($).ready(function () {

    $('input').keyup(function () {

        $('p').text($('input').val());

    })

})

3-3 编程练习：jQuery键盘事件案例的更多相关文章

  1. jquery键盘事件全记录

    很多时候,我们需要获取用户的键盘事件,下面就一起来看看jquery是如何操作键盘事件的. 一.首先需要知道的是: 1.keydown() keydown事件会在键盘按下时触发. 2.keyup() k ...

  2. js进阶 12-4 jquery键盘事件如何使用

    js进阶 12-4 jquery键盘事件如何使用 一.总结 一句话总结:键盘和鼠标都是外设输入设备,所以函数很像,所以使用就像鼠标事件click一样 1.jquery键盘事件有哪三个? 1(up和do ...

  3. jquery键盘事件总结

    在工作中在发现同事在写输入密码按键的相关js效果时,发现自己对于这块很是不了解,这几天特地了解了一下,进行以下总结: 一.首先要知道键盘事件的几个属性: 1.keydown():在键盘按下时触发. 2 ...

  4. jquery 键盘事件的使用方法详解

    转自:https://www.jb51.net/article/123579.htm jQuery处理键盘事件有三个函数,根据事件发生的顺序分别是: jquery 代码: 1.  keydown(); ...

  5. js/jquery键盘事件及keycode大全

    js/jquery的键盘事件分为keypress.keydown和keyup事件 一.键盘事件 1.keydown()事件当按钮被按下时,发生 keydown 事件. 2.keypress()事件ke ...

  6. jquery键盘事件

    场景:当我们遇到onclick按钮事件时需要按回车执行时就用到了键盘监听事件 例如:<button id="sign_in_button" class="btn b ...

  7. javascript/jquery键盘事件介绍

    一.首先需要知道的是:1.keydown()keydown事件会在键盘按下时触发.2.keyup()keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件3.keypress()keypres ...

  8. JQUERY 键盘事件

    一 一.首先需要知道的是: 1.keydown()keydown 事件会在键盘按下时触发. 2.keypress()keypress 事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键. 3. ...

  9. jQuery键盘事件绑定Enter键

    <script> $(function(){ $(document).keydown(function(event){ if(event.keyCode==13){ $("#mo ...

随机推荐

  1. 【转】Java的path,classpath,java_home环境变量的配置与具体含义

    对于一个Java初学者来说,第一步要做的是安装jdk并配置环境变量,一般按照书上或者网上的步骤,一步步照着做就行了,但是对于初学者来说,很多问题没有解决,比如为什么很多配置方法各不相同,却都能够配置成 ...

  2. 舒适的路线（codevs 1001）

    题目描述 Description Z小镇是一个景色宜人的地方,吸引来自各地的观光客来此旅游观光.Z小镇附近共有N(1<N≤500)个景点(编号为1,2,3,…,N),这些景点被M(0<M≤ ...

  3. 整体二分初识--POJ2104：K-th Number

    n<=100000个数有m<=5000个询问,每次问区间第k大. 方法一:主席树!…… 方法二:整体二分. 整体二分一次性计算半个值域对一个区间的询问的贡献,然后根据“这半边的贡献在某个询 ...

  4. mac idea快捷键（部分常用）

    shift+F6重命名 shift+enter 换到下一行 shift+F8等同eclipse的f8跳到下一个断点,也等同eclipse的F7跳出函数 F8等同eclipse的f6跳到下一步F7等同e ...

  5. NOIP 2009 潜伏者

    P1071 潜伏者 题目描述 RR 国和 SS 国正陷入战火之中,双方都互派间谍,潜入对方内部,伺机行动.历尽艰险后,潜伏于 SS 国的 RR 国间谍小 CC 终于摸清了 SS 国军用密码的编码规则: ...

  6. ios计算字符串宽高,指定字符串变色,获取URL参数集合

    #import <Foundation/Foundation.h> @interface NSString (Extension) - (CGFloat)heightWithLimitWi ...

  7. Oracle建表提示SQL 错误: ORA-00904: : 标识符无效

    Oracle建表提示: 错误报告:SQL 错误: ORA-00904: : 标识符无效00904. 00000 -  "%s: invalid identifier"*Cause: ...

  8. 016 ppp authentication

    Press RETURN to get started!       Router>en Router#config t Enter configuration commands, one pe ...

  9. 消息驱动bean(MDB)实例

    到眼下为止前面介绍的有关JavaEE的东西都是同步的.也就是说调用者调用某个方法.那么这种方法必须马上运行并返回运行结果. 用官方一些的语言来说就是"client通过业务接口调用一个方法,在 ...

  10. Boss OpenCart 商城自适应主题模板 ABC-0012-01

    Boss OpenCart 商城自适应主题模板 ABC-0012-01 模板特性兼容浏览器IE7, IE8, IE9, IE10, Firefox, Safari, Chrome OpenCart版本 ...