javascript - 如何通过dojo检测textarea的变化

Question

require(["dijit/form/Button", "dojo/dom", "dojo/domReady!"], function(Button, dom){

    // Create a button programmatically:
    var myButton = new Button({
        disabled:true,
        label: "Click me!",
        onClick: function(){
            // Do something:
            dom.byId("result1").innerHTML += "Thank you! ";
        }
    }, "progButtonNode").startup();

});

require(["dijit/form/Textarea","dijit/registry","dojo/dom" ,"dojo/on","dojo/domReady!"], function(Textarea,registry,dom,on){

    var textarea = new Textarea({
        name: "myarea",
        value: "This is the text area...\n\n\n\n\n\n",
        style: "width:200px;"
    }, "myarea").startup();

    //disalbe the button...
    //registry.byId("progButtonNode").set("disabled",true);

    //test
    dom.byId("result1").innerHTML += "Good!";

    //add onchange event...
    //var button = registry.byId("progButtonNode");
    alert('hi');


    on(textarea,"change",function(){
        alert('3');
        registry.byId("progButtonNode").set("disabled",false);

    });
});

以上是我的代码。

我的要求是检测从文本区域进行的更改，然后设置按钮启用。 (该按钮默认禁用)

我收到错误:未捕获的类型错误:无法读取未定义的属性“on”

非常感谢!

Answer 1

要检测小部件 Textarea 上的更改，请在初始化时使用 onChange。

使用 registry.byId() 让您的 Button 被插入并使用方法 .set( 将属性 disabled 设置为 false );

工作示例:https://jsfiddle.net/41epfsdd/

请注意，我使用了 intermediateChanges: true，这允许 onChange 在每次击键时触发，从而更改小部件 Textarea 内的值。如果您省略它或使用 intermediateChanges: false 代替，onChange 事件只会在字段模糊时触发。

require(["dijit/form/Button", "dijit/form/Textarea", "dijit/registry", "dojo/dom", "dojo/on", "dojo/domReady!"], function(Button, Textarea, registry, dom, on) {

  var myButton = new Button({
    disabled: true,
    label: "Click me!"
  }, "progButtonNode").startup();

  var textarea = new Textarea({
    name: "myarea",
    value: "This is the text area...\n\n\n\n\n\n",
    intermediateChanges: true,
    onChange: function() {
      var progButtonNode = registry.byId('progButtonNode');
      progButtonNode.set('disabled', false);
    }
  }, "myarea").startup();
});

编辑:关于您对如何在已生成的 Textarea 小部件上应用事件处理程序的评论。您可以使用dojo/on示例:

require(["dojo/on"], function(on){
  on(target, "event", function(e){
    // handle the event
  });
});

基于您的评论的示例:

on(this.lastCommentTextArea, 'change', function(event){ 
   // handle the event
})