單擊標簽時，選擇文本框中的所有文本

Question

我在我的網站中為輸入元素使用屬性標簽for這將幫助盲目的用戶。

當前，當用戶單擊標簽時，相應的輸入被激活。 這意味着如果有用於名稱的文本框，則光標將位於文本框的開頭。

例如，如果文本框中的名稱為“ John”，則在單擊標簽時，光標將進入文本框並顯示在“ John”之前。

但是我想要的是應該選擇“ John”。 這意味着應該選擇文本框的文本。

誰能幫我實現這個目標？

我的代碼如下所示：

 <div class="editor-label"> <label for="ContactName">*Name</label> </div> <div class="editor-field"> <div> <input id="ContactName" maxLength="40" name="ContactName" type="text" value="John" /> </div> </div> 

Answer 1

我不確定是否可以僅使用html / css來實現這一目標，因此很有可能需要使用JS庫，例如jQuery。

通過使用jQuery，您可以在select()標簽時使用select()方法，例如：

$(function() {
    $('label').click(function() {
        var id = $(this).attr('for');
        $('#'+id).select();
    });
});

一個有效的示例可以在這里找到： http : //jsfiddle.net/sf3bgwxr/