在 XUL 中捕获文本框中的换行符

发布于 2024-12-12 06:13:04 字数 2965 浏览 0 评论 0原文

问题：如何获取输入到如下所述创建的文本框中的字符串中的换行符？

动机：我试图对 FireFox 扩展 (Zotero) 进行一些非常简单的修改，以使其更易于使用。此扩展允许您通过在文本框中输入标签并按 Enter 键来输入项目的标签。我希望能够一次输入一堆标签，方法是将它们作为字符串粘贴到文本框中，并以换行符作为标签之间的分隔符。选择换行符是因为其他字符也是在标签本身中使用的可行选择。

问题：当我现在将字符串粘贴到输入文本框中时，它会删除所有换行符并用单个空格替换它们。我在扩展代码中找不到发生这种情况的任何地方，所以我认为它是文本框本身的属性。我正在尝试查找此文本框的文档，看看是否有一些属性可以使用，以便我可以捕获换行符，但我对 JavaScript 和 HTML 不太熟悉，并且无法找到任何内容。我想找到侵入性最小的解决方案（不会改变文本框当前输入新条目并按 Enter 键的方式的解决方案），以便这种修改可以被采用到扩展的核心版本中。

资源：到目前为止，我在网上发现的唯一讨论类似问题的内容是另一个关于允许在文本框中使用制表符但不允许换行符的问题。我不确定这是一个 HTML 问题（是否有一个属性可以设置为允许保留换行符？）还是一个 JavaScript 问题（我需要重写下面引用的代码吗？）。我一直在尝试查看两者的文档，但到目前为止还没有找到任何内容（大多数 HTML 教程讨论文本区域而不是文本框）。

代码：这是创建文本框对象的代码（或者它是方法还是表单？）我正在处理：

        <method name="showEditor">
            <parameter name="elem"/>
            <body>
            <![CDATA[
                // Blur any active fields
                /*
                if (this._dynamicFields) {
                    this._dynamicFields.focus();
                }
                */

                Zotero.debug('Showing editor');

                var fieldName = 'tag';
                var tabindex = elem.getAttribute('ztabindex');

                var tagID = elem.parentNode.getAttribute('id').split('-')[1];
                var value = tagID ? Zotero.Tags.getName(tagID) : '';
                var itemID = Zotero.getAncestorByTagName(elem, 'tagsbox').item.id;

                var t = document.createElement("textbox");
                t.setAttribute('value', value);
                t.setAttribute('fieldname', fieldName);
                t.setAttribute('ztabindex', tabindex);
                t.setAttribute('flex', '1');

                // Add auto-complete
                t.setAttribute('type', 'autocomplete');
                t.setAttribute('autocompletesearch', 'zotero');
                var suffix = itemID ? itemID : '';
                t.setAttribute('autocompletesearchparam', fieldName + '/' + suffix);

                var box = elem.parentNode;
                box.replaceChild(t, elem);

                // Prevent error when clicking between a changed field
                // and another -- there's probably a better way
                if (!t.select) {
                    return;
                }

                t.select();

                t.addEventListener('blur', function () {
                    document.getBindingParent(this).blurHandler(this);
                }, false);
                t.setAttribute('onkeypress', "return document.getBindingParent(this).handleKeyPress(event)");

                this._tabDirection = false;
                this._lastTabIndex = tabindex;

                return t;
            ]]>
            </body>
        </method>

原文

Question: how can I grab the newlines in a string entered into a textbox created as described below?

Motivation: I am trying to make a couple really simple modifications to a FireFox extension (Zotero) to make it easier for me to use. This extension allows you to enter tags for an item by typing them into a textbox and hitting enter. I would like to be able to enter a bunch of tags at once by pasting them into the textbox as a string with newline as the delimiter between tags. newline was chosen because other characters are viable choices for use in the tag itself.

Problem: when I paste a string into the entry textbox right now, it strips out all of the newlines and replaces them with single spaces. I can't find anywhere in the extension code where this happens, so I think it is a property of the textbox itself. I am trying to look up documentation for this textbox to see if there are some properties I can play with so that I can catch the newlines, but I am not very familiar with JavaScript and HTML and am having trouble finding anything. I'd like to find the least invasive solution possible (one that doesn't change the way the textbox currently works for typing in new entries and hitting enter) so that this modification could be adopted into the core version of the extension.

Resources: so far the only thing I have found online discussing a similar issue is this other question about allowing tab in a textbox but not newline. I am not sure if this is an HTML issue (is there a property that could be set to allow the newlines to be retained?) or a JavaScript one (do I need to rewrite the code quoted below?). I have been trying to look at documentation for both but have not found anything so far (most HTML tutorials discuss textarea rather than textbox).

Code: here is the code that creates the textbox object (or is it a method or a form?) I am dealing with:

        <method name="showEditor">
            <parameter name="elem"/>
            <body>
            <![CDATA[
                // Blur any active fields
                /*
                if (this._dynamicFields) {
                    this._dynamicFields.focus();
                }
                */

                Zotero.debug('Showing editor');

                var fieldName = 'tag';
                var tabindex = elem.getAttribute('ztabindex');

                var tagID = elem.parentNode.getAttribute('id').split('-')[1];
                var value = tagID ? Zotero.Tags.getName(tagID) : '';
                var itemID = Zotero.getAncestorByTagName(elem, 'tagsbox').item.id;

                var t = document.createElement("textbox");
                t.setAttribute('value', value);
                t.setAttribute('fieldname', fieldName);
                t.setAttribute('ztabindex', tabindex);
                t.setAttribute('flex', '1');

                // Add auto-complete
                t.setAttribute('type', 'autocomplete');
                t.setAttribute('autocompletesearch', 'zotero');
                var suffix = itemID ? itemID : '';
                t.setAttribute('autocompletesearchparam', fieldName + '/' + suffix);

                var box = elem.parentNode;
                box.replaceChild(t, elem);

                // Prevent error when clicking between a changed field
                // and another -- there's probably a better way
                if (!t.select) {
                    return;
                }

                t.select();

                t.addEventListener('blur', function () {
                    document.getBindingParent(this).blurHandler(this);
                }, false);
                t.setAttribute('onkeypress', "return document.getBindingParent(this).handleKeyPress(event)");

                this._tabDirection = false;
                this._lastTabIndex = tabindex;

                return t;
            ]]>
            </body>
        </method>

分享到QQ

分享到微博