Extjs中textarea不支持keyup事件？

Web 开发 > JavaScript
收藏 回复
[问题点数：20分]
更多帖子
私信 空间 博客
jofone
等级
本版专家分：0
结帖率 33.33%
    最近做一个项目，用到Ext.form.textarea, 在监听事件中添加了keyup事件，并将enableKeyEvents属性设为true，但并不执行该事件，不知道为什么？ Ext.form.textfield则没有任何问题。郁闷，哪位高手能否指点一二！谢谢！
只看楼主 引用 举报 楼主 收起
展开阅读全文
更多帖子
私信 空间 博客
版主
sunxing007
等级
本版专家分：4321
我不知道你的为什么不可以，我修改了examples/form/absform.js,你拷贝回去试试看absform.html。


/*

 * Ext JS Library 2.2.1

 * Copyright(c) 2006-2009, Ext JS, LLC.

 * licensing@extjs.com

 * 

 * http://extjs.com/license

 */



Ext.onReady(function() {

    var form = new Ext.form.FormPanel({

        baseCls: 'x-plain',

        layout:'absolute',

        url:'save-form.php',

        defaultType: 'textfield',



        items: [{

            x: 0,

            y: 5,

            xtype:'label',

            text: 'Send To:'

        },{

            x: 60,

            y: 0,

            name: 'to',

            anchor:'100%'  // anchor width by percentage

        },{

            x: 0,

            y: 35,

            xtype:'label',

            text: 'Subject:'

        },{

            x: 60,

            y: 30,

            enableKeyEvents: true,

            name: 'subject',

            anchor: '100%',  // anchor width by percentage

            listeners: {

            		keyup: function(src, evt){

            				alert(src.getValue());

            		}	

            }

        },{

            x:0,

            y: 60,

            xtype: 'textarea',

            name: 'msg',

            enableKeyEvents: true,

            anchor: '100% 100%',  // anchor width and height,

            listeners: {

            		keyup: function(src, evt){

            				alert(src.getValue());	

            		}	

            }

        }]

    });

    var window = new Ext.Window({

        title: 'Resize Me',

        width: 500,

        height:300,

        minWidth: 300,

        minHeight: 200,

        layout: 'fit',

        plain:true,

        bodyStyle:'padding:5px;',

        buttonAlign:'center',

        items: form,



        buttons: [{

            text: 'Send'

        },{

            text: 'Cancel'

        }]

    });

    window.show();

});
只看TA 引用 举报 #1得分 0
更多帖子
私信 空间 博客
版主
sunxing007
等级
本版专家分：4321
我用的是2.2测试的
只看TA 引用 举报 #2得分 0
更多帖子
私信 空间 博客
jofone
等级
本版专家分：0
    我用的也是2.2，你的代码我测试了一下，没有问题，可将你的代码放到我的代码里就不行了。你是将textarea放在FormPanel里，而我是将其放在Panel的fieldset里，跟这有关系吗？
只看TA 引用 举报 #3得分 0
更多帖子
私信 空间 博客
版主
sunxing007
等级
本版专家分：4321
没有任何关系， 方在哪儿都一样， 你看到textarea的构造函数了没？它是一个完整的可独立的对象。
给你例子：
textarea.js


Ext.onReady(function(){

    var p = new Ext.Panel({

        title: 'My Panel',

        collapsible:true,

        renderTo: 'tt',

        width:400,

        height: 300,

        items:[

    		{

            x: 100,

            y: 0,

            xtype: 'textarea',

            name: 'msg',

            enableKeyEvents: true,

            height:'100%',

            width:'100%',

            listeners: {

            		keyup: function(src, evt){

            				alert(src.getValue());	

            		}	

            }

    		}

        ]

    });

});

textarea.html:


<html>

<head>

    <title>Textarea</title>

    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>



    <!-- GC -->

    <!-- LIBS -->

    <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>

    <!-- ENDLIBS -->



    <script type="text/javascript" src="../../ext-all.js"></script>



    <script type="text/javascript" src="textarea.js"></script>

    <link rel="stylesheet" type="text/css" href="forms.css"/>



    <!-- Common Styles for the examples -->

    <link rel="stylesheet" type="text/css" href="../shared/examples.css"/>

</head>

<body>

<div id="tt"></div>

</body>

</html>

有问题多看例子，多看extjs.com/docs.
问别人是问不到什么的， 因为懂得人太少了。
我知道得也不多， 今天要不是你问关于listeners的事情，我还不会添加listener，然后我就在examples目录下面搜索listener， 很快例子就出来了。
只看TA 引用 举报 #4得分 0
更多帖子
私信 空间 博客
jofone
等级
本版专家分：0
目前我的问题还没有解决，还是谢谢你！你给的代码我测试过了，是没有问题，但把握的代码放进去就不行，change事件可以用，textfield的keyup事件可以用，这让我实在有些郁闷，继续研究吧！
只看TA 引用 举报 #5得分 0
更多帖子
私信 空间 博客
shoarh
等级
本版专家分：0
加上这些试试
Ext.override(Ext.form.TextArea, {
    onKeyUp : function(e){
        if(!e.isNavKeyPress() || e.getKey() == e.ENTER){
            this.autoSize();
        }
        Ext.form.TextArea.superclass.onKeyUp.call(this, e);
    }
});
只看TA 引用 举报 #6得分 0
更多帖子
私信 空间 博客
NetVer
等级
本版专家分：252
enableKeyEvents: true

要把enableKeyEvents属性设置为true
只看TA 引用 举报 #7得分 0
私信 空间 博客
duni2013
等级
本版专家分：0
我今天也遇到同样的困难，一下是我的代码，也不出现提示：
var mn = new Ext.form.TextField({
name : 'searchusername',
id : "searchusername",
width : 210,
scope : this,
enableKeyEvents : true,
listeners : {
'keyup' : function(o, evt) {
alert(3);
}
}
});
只看TA 引用 举报 #8得分 0
收起
收藏 回复
jofone

等级：

关注 私信 TA的帖子
解决Extjs中textarea不支持keyup事件的问题

最近用到Ext.form.textarea, 在监听事件中添加了keyup事件，并将enableKeyEvents属性设为true，但并不执行该事件，不知道是什么原因？ Ext.form.textfield则没有任何问题。 JScript code： /* * Ext JS Library ...

Extjs textfield keyup事件

new Ext.form.NumberField({ id: "txtIssuedNum", fieldLabel: '<% = GetLocalResourceObject("WriteAddRecordText") %>', allo...

ExtJS中TextField或TextArea支持按键事件的条件

原文出处: http://www.javatang.com/archives/2010/07/07/5638409.html作者: Jet Mah from ... 在ExtJS中，对事件进行捕获有两种方式：一种是设置listeners属性，另外一种就是使用on方法，代码如下： var t...

Extjs 限制 textfield / textarea 输入字数 , 兼容 IE Firefox Chrome

Extjs 限制 textfield / textarea 输入字数 , 兼容 IE Firefox Chrome 标签： extjs 中文输入extjs 字段最大长度 2012-06-22 16:58 7783人阅读 评论(5) 收藏 举报  分类： ExtJS（15）  ...

Extjs 下拉框监听例子

{ columnWidth : .92, layout : 'form', labelWidth : 60, // 标签宽度 defaultTy

textarea文本域自适应高度[自动增加高度]

textarea文本域自适应高度[自动增加高度] 在作为留言或者其他的网站备注的地方都是用的textarea，但是当文字多过其高度的时候，前面的文字就被顶到上面去了，要看内容还要翻上去。 当有了这个就不需要了，因为...

Extjs重写

// 重写ext组件 Ext.BLANK_IMAGE_URL = '/images/public/s.gif"'; /** * 允许直接修改label显示值 */ Ext.override(Ext.form.Label, { setText : function(t) { this.text = t;... if (this.rendered) { ...

extjs初学者教程

extjs初学者教程 标签： extjs 2015-05-27 15:35 522人阅读 评论(0) 收藏 举报 分类： ExtJS（32） layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Co

Extjs初学入门，详细panel、form、grid等介绍

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.Container.AbstractContainer  Ext.container.Container  

ExtJS基本控件

1.Ext xtype类型 Ext xtype 类型 xtype Class ------------- ------------------ box Ext.BoxComponent 具有边框属性的组件 button Ext.Button　按钮 colorpalette Ext....component Ext.

extjs 基本控件

1.Ext xtype类型 Ext xtype 类型 xtype Class ------------- ------------------ box Ext.BoxComponent 具有边框属性的组件 button Ext.Button　按钮 colorpalette Ext...

ExtJS-入门（转载自http://www.blogjava.net/puras/archive）

2010-01-13缩略显示ExtJS-入门（转载自http://www.blogjava.net/puras/archive）文章分类:Web前端 在ExtJS里最...试在这个方法中添加一条语句,看看页面打开后是什么反映: <br /> Ext.onReady(function() {

ExtJs实现EditGrid中的增删改查操作（2）

1.本例要实现的效果为，如下图所示的窗口信息 双击某条信息，将会出现一个工具条可以对其进行操作，如下 2.本例是在ExtJs官方提供的examples里面的基础上改进的，使用的是SSH...首先，要导入ExtJs官方例子中...

ExtJS 屏蔽backspace

* 键盘事件管理 */ Ext.define("Gboat2.desktop.util.KeyManager", { alternateClassName : "GKeyManager", singleton : true, maskBackspace : function...

微博@输入功能的ExtJS实现

微博的@辅助输入功能具有方便快捷的特点，基础功能描述为： 1.在TextArea内输入“@”时，在光标处弹出选项列表。 2.... 人肉相关文章之后才知道：在非ie浏览器下，获得TextArea的光标位置...

extjs的空间htmlEditor源码 浅析，可以重写里面的方法来扩展相关功能

The source code /** * @class Ext.form.HtmlEditor * @extends Ext.form.Field * Provides a lightweight HTML Editor component. Some toolbar features are

文本框双击

在ext-all.js中添加可双击文本框组件： Ext.form.WMTextField = Ext.extend(Ext.form.TextField, { initComponent : function () { Ext.form.TextField.superclass.initComponent.call(this); this....

Extjs form实战记录

为什么80%的码农都做不了架构师？>>> ...

关于文本框字数的限制以及动态显示剩余字数

一、首先先看一个非常普遍的效果截图，根据需求写代码 <div style="padding-bottom: 100px">...textarea style="width:230..." id="textArea" cols="30" rows="10">dancer测试！</textarea> &l...

Web基础：jQuery下篇：千变万化的事件

所谓jQuery事件，其实就是jQuery对javascript的事件处理进行的封装，其调用和绑定更加方便和灵活。由于有了强大的选择器的帮助，HTML代码里就不需要javascript的逻辑处理了，可以动态绑定。 函数绑定： 细说事件...

第一个ext.js demo

https://www.w3cschool.cn/extjs/extjs_environment_setup.html * 目录结构 * index.html &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&...

最强前端笔记（没有之一）(^-^)

MD 语法 链接 [淘宝网](http://www.taobao.com/) 图片 ![图片标题](file:///Users/wangjing/Desktop/511542077195.jpg) 标题 # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ... *这是...

C#入门必看实力程序100个

C#入门必看含有100个例字,每个例子都是针对C#的学习关键知识点设计的,是学习C#必须知道的一些程序例子,分享给大家，需要的可以下载

c语言项目开发实例

十个c语言案例 （1）贪吃蛇 （2）五子棋游戏 （3）电话薄管理系统 （4）计算器 （5）万年历 （6）电子表 （7）客户端和服务器通信 （8）潜艇大战游戏 （9）鼠标器程序 （10）手机通讯录系统

2020美赛特等奖A题8篇论文（可通过书签跳转）.pdf

2020美赛特等奖A题8篇论文

2019年美赛D题一等奖论文

2019年数模美赛D题一等奖论文中文版本与最终版本，这里面卢浮宫的疏散方法可以修改为任意一篇快速疏散论文，搞数模竞赛的同学可以进行下载学习。

嵌入式工程师养成计划之——嵌入式软件工程师完全学习指南

本系列课程针对有意向学习嵌入式软件开发的童鞋，从零开始、深入浅出，内容涵盖：linux系统基础、shell、linux C编程、linux系统编程、网络编程、ARM体系结构及汇编语言、ARM裸机编程、linux系统移植、linux驱动开发等模块。

2020美赛A题海温数据.zip

2020美赛a题海温数据，1877年至今，趁比赛还没结束上传赚点资源值 全球海洋温度影响某些海洋生物的栖息地质量。当温度变化太大，它们无法继续繁荣时，这些物种就会迁移到其他更适合它们现在和未来生活和繁殖成功的栖息地。其中一个例子就是美国缅因州的龙虾种群，它们正缓慢地向北迁移到加拿大，那里的海洋温度较低，为它们提供了更合适的栖息地。这种地理种群的转移可能会严重影响依赖海洋生物稳定性的公司的生计。 您的团队已被苏格兰北大西洋渔业管理协会聘请为顾问。该协会希望在全球海洋温度升高的情况下，更好地了解与苏格兰鲱鱼和鲭鱼从它们目前的栖息地苏格兰附近迁移有关的问题。这两种鱼类为苏格兰渔业做出了巨大的经济贡献。鲱鱼和鲭鱼种群分布位置的变化，可能会让规模较小的苏格兰渔业公司在经济上变得不切实际。这些公司使用渔船，但船上没有冷藏设备。

Office2016专业增强版中文免费正式版(附安装教程)64位

Microsoft office 2016专业增强版是一款由官方发布的Microsoft office办公软件，而且免费开放给所有Windows用户免费使用，其中Excel、word、PPT都非常智能化，界面最新加入暗黑主题，并且按钮的设计风格开始向Windows10靠拢。本平台提供Office 2016专业增强版，需要的朋友可下载试试！ Office 2016 专业增强版安装教程 1. 下载

2020美赛C题资料.zip

关于2020年数模美赛c题的，题目，数据，文献资料，一些代码，以及思路和感想。其中在感想部分谈及了C题两种解答方法的对比（评论处理方法，另一种是我们老师带的另外几队拿了H奖的）。我们对这次论文交的比较匆忙，摘要是在最后一点时间里赶出来的，文章很多细节部分都有些问题，特别是问题分析部分忘记放上去就交了，有点尴尬。本来对这次结果不抱太大希望，后来却拿了m奖（虽然对于拿o奖，f奖的大佬们来说这不算什么），但对于失误较多的我们来说已经比较满意了。希望我的分享能对美赛有兴趣的同学起到一些帮助。

相关热词 c#编辑 list c#泛型的协变与逆变 c# html code vs 开发c# c#注释快捷键 vs c# csv xlsx c# 新闻 c# 控件 改成自定义 c# model mvc c# 为啥不弹出异常