javascript - 仅在第一次单击时选择所有文本

Question

我使用的是 Dojo 1.6，并且希望仅在第一次单击时选择文本框的所有文本。我知道我可以使用 dojo.byId("id").select();选择整个文本，但问题是您无法再对文本进行子选择。我提供了一个小代码示例来说明该问题。

require(["dojo/parser", "dijit/form/TextBox"]);

require(["dojo/query", "dojo/on",  "dojo/domReady!"], function(query, on) {
    query("#firstname").on("click", function(evt) {
        // this will not work because I want to select 1 or more characters
        if (!dojo.byId("firstname").select())
           dojo.byId("firstname").select();
    });
});

还有 fiddle :http://jsfiddle.net/3CLz9/

所以主要问题是我无法确定是否选择了一个或多个字符。

Answer 1

您可以使用dojo/on模块的once()功能。但我不认为这就是你想要的。我想您想在每次输入字段获得焦点时选择文本。如果您需要此功能，则应该使用 onFocus 事件(因此将 “click” 替换为 “focus”)。

现在唯一的问题是，选择文本后，默认事件会将光标移动到所选位置并取消选择文本(您将看到它闪烁)。为了解决这个问题，您还应该绑定(bind)一个 mouseup 事件处理程序，该处理程序会在您刚刚获得焦点时取消。例如:

query("#firstname").on("focus", function(evt) {
    this.select();
    on.once(this, "mouseup", function(evt) {
       evt.preventDefault(); 
    });
});

我还更新了您的fiddle .

<小时/>

我刚刚注意到你实际上使用的是 dijit/form/TextBox 小部件(在你的 JSFiddle 上不起作用，所以这就是我没有注意到它的原因)，但是你可以轻松地做到这与 selectOnClick 属性一起使用。将其添加到您的 data-dojo-props 中，它将起作用。

例如:

<input type="text" name="firstname" value="testing testing"
    data-dojo-type="dijit/form/TextBox"
    data-dojo-props="trim:true, propercase:true, selectOnClick: true" id="firstname" />

这里是your fiddle (带有工作文本框小部件)。如果您想对 1.7 以下的 Dojo 版本执行相同的操作，您可以按照 this fiddle 中的描述进行操作。 .