从 DOM 闯入表单元素事件-解网

问：

我是一家公司的新手，该公司拥有具有数百万个 SLOC 的 Web 应用程序。

出于某种原因，当单击文本区域（在任何浏览器中）时，将取消选择关联的单选按钮。

我不确定 textarea 触发了什么 JavaScript ，我开始怀疑不显眼的代码，虽然封装了与标记没有直接关系的代码，但是否使得追捕和闯入源代码的关键部分变得霸道。onclick

有没有办法使用 Chrome 开发者控制台闯入取消选择单选按钮的 JavaScript？我尝试了几种选择，但无济于事:(

奖励：这是不显眼的 JavaScript 的缺点吗？

编辑：这是HTML：

<div class='radio'>
    <label data-toggle='tooltip' title='Originated somewhere else.'>
    <input type='radio' id='q2023_r2320' name='q2023' value='2320'  Other />*Other</label>
    <br />
    <textarea id='q2023_r2320_text' name='q2023_r2320_text' style='width:80%;' rows='1' class='form-control'>
    </textarea>
</div>

javascript google-chrome-devtools dom-events unobtrusive-javascript

您或许可以使用 Chrome 开发工具的事件侦听器断点，该断点会为大量受支持的事件类型中的任何一种设置全局断点。有关如何设置它们，请参阅此处的答案。您可以将鼠标设置为单击一个>，然后单击文本区域并开始单步执行代码以查看它的位置，这应该会引导您收听单击的内容。从那里，如果你需要知道的话，你希望首先弄清楚听众是如何连接的。

答：

1赞 wired_in 10/18/2014 #1

您可以向单选按钮添加一个更改事件处理程序，在其中添加一个断点，当它被命中时，查看堆栈跟踪。此外，尝试在 chrome 开发工具的 Sources 选项卡中执行 Ctrl-Shift-F 并搜索相关的钩子，例如“radio”和“form-control”类。

1赞 Scorpion-Prince 10/18/2014 #2

有一种方法可以中断 Chrome 开发者工具中对 DOM 元素的更改。在 chrome 中导航到您的网页，右键单击您感兴趣的元素，然后单击“检查元素”。在打开的 Chrome Dev 工具窗口中，应选择 DOM 元素。再次右键单击 Chrome 开发者工具窗口中的该元素，然后将鼠标悬停在 Break On 上下文菜单上。您应该看到 3 个选项 - 子树修改、属性修改和节点删除。由于单选按钮处于取消选中状态，因此可以在属性修改时中断。单击文本区域，chrome 开发工具应命中断点，显示哪段代码修改了单选按钮属性。

从 DOM 闯入表单元素事件

Breaking into form element event from DOM

评论

评论