在ExtJS中跟踪按钮

Question

我是网络工程师，正在尝试在网页上提供SSO方法。在SSO项目上工作时，我发现自己处于一个不断学习的圈子，到目前为止，我学到了很多东西，例如基本的html，js和http协议。

无论如何，用ExtJS编写的网页，您可能会猜到它们下方有几个输入框和一个按钮。我不熟悉ExtJS，当我查看源代码时，找不到按钮的事件/触发器。在跟踪此按钮时，我尝试在执行时间（Chrome）中添加代码中断，但未触发“ click”事件。 “鼠标按下”事件帮助我增加了代码执行中断。但是由于缺乏对ExtJS的了解，我无法理解代码。而且，这看起来不像经典的html表单，因为没有与“表单”相关的标签。到目前为止，我已经设法填满了输入框，但找不到调用该按钮的正确方法。

页面上的输入框。

<input class="x-input-el x-input-text x-form-field login_input_username_icon" type="text" id="ext-element-19" autocapitalize="none" autocomplete="off" autocorrect="off" name="UserName" placeholder="Name">

<div class="x-unsized x-field-input" id="ext-input-3"><input class="x-input-el x-input-password x-form-field login_input_password_icon" type="password" id="ext-element-25" autocapitalize="none" name="Password" placeholder="Password"><div class="x-field-mask" style="display: none !important;" id="ext-element-26"></div><div class="x-clear-icon" id="ext-element-27"></div></div>

<div class="x-unsized x-field-input" id="ext-input-4"><input class="x-input-el x-form-field x-input-text" type="text" id="ext-element-31" autocapitalize="sentences" name="Company" placeholder="Company"><div class="x-field-mask" style="" id="ext-element-32"></div><div class="x-clear-icon" id="ext-element-33"></div></div>

这些是用于填充这些输入框的Javascript代码。

document.getElementById('ext-element-19').value="John"
document.getElementById('ext-element-25').value="Secret"
document.getElementById('ext-element-31').value="C-Corp"

和按钮：

<div class="x-button-normal x-button button_green x-layout-box-item x-stretched" id="btnGo" style="margin: 20px 0px 0px !important;"><span id="ext-element-46" class="x-badge" style="display: none;"></span><span class="x-button-icon x-hidden" id="ext-element-48"></span><span id="ext-element-47" class="x-button-label" style="">Enter</span></div>

在ExtJS的“视图中

  {
  xtype: "button",
  id: "btnGo",
  text: "Enter",
  cls: "button_green",
  margin: "20px 0px 0px 0px"
  },

如果我能找到调用/单击该按钮的正确方法，我相信可以在响应时间内注入一个javascript代码，然后再将其发送到客户端浏览器。

• 我该如何进一步研究？
• 在这种情况下如何跟踪按钮？

谢谢您的时间。

Answer 1

负责在经典ExtJS应用程序中监听单击事件的代码通常位于controller中。控制器文件中肯定会包含字符串extend: 'Ext.app.Controller'。您的按钮有一个ID（btnGo），因此很可能该代码负责创建侦听器，如下所示：

...
this.control({
...
  '#btnGo' :{
     click: this.login //method name will may vary
  },
...
});
...

在我的示例中，login方法必须包含用于发送授权请求的逻辑。