Какой HTML или CSS мне нужно написать, чтобы сделать текст атрибута заполнителя выбираемым / выделяемым с помощью мыши? - PullRequest
Новая
       6

Какой HTML или CSS мне нужно написать, чтобы сделать текст атрибута заполнителя выбираемым / выделяемым с помощью мыши?

0 голосов
/ 22 мая 2018

Как я могу позволить кому-то выделять с помощью мыши заполнитель текста поля ввода?В настоящее время я не могу только читать текст заполнителя, и я не знаю, как разрешить выбор текста заполнителя с помощью выделения мыши.

Вот мое поле ввода: 

<input 
  locale="en" 
  maxlength="255" 
  placeholder="I want to select, highlight and copy this text" 
  size="255" 
  type="text" 
  name="user[first_name]" 
  id="user_first_name">

РЕДАКТИРОВАТЬ:

SO говорит мне, что это потенциальный дубликат .

Я думаю, что мой вопрос потенциально другой, потому что я хочу знать, как я бы позволил пользователю выделить и скопировать текст placeholder с помощью мыши.Связанный пост SO спрашивает о том, как создать кнопку, которая позволяет копировать текст-заполнитель поля в буфер обмена.Мне, с другой стороны, интересно, как разработчик мог бы написать HTML / CSS, чтобы позволить пользователю с помощью мыши скопировать текст заполнителя.

РЕДАКТИРОВАТЬ 2:

Конечная цель с формой вводаЗдесь нет ничего особенного.У меня просто есть запрос от клиента, что он хотел бы выделить и скопировать текст заполнителя поля ввода текста.Я хотел бы удовлетворить их просьбу, но я также рад и могу объяснить им, что эта функция, которую они запрашивают, невозможна, поскольку значение placeholder просто не работает таким образом.Я был бы признателен за некоторую «официальную» документацию, описывающую вышеупомянутое ограничение, касающуюся выделения текста заполнителя.

Ответы [ 2 ]

0 голосов
/ 22 мая 2018

В этом примере текст копируется непосредственно в буфер обмена:

Вы также можете просто использовать значение и закрасить его светло-серым, а затем изменить цвет при обмене текстом, чтобы он выглядел как заполнитель. 

        <script>
            $('#user_first_name').on('click', function() {
                document.querySelector("#user_first_name").select();
                document.execCommand('copy');
                alert('copied to clipboard');
            });
        </script>
0 голосов
/ 22 мая 2018

Вы можете использовать value для выбора. 

    <input 
      locale="en" 
      maxlength="255" 
      placeholder="I want to select, highlight and copy this text" 
      value="I want to select, highlight and copy this text" 
      size="255" 
      type="text" 
      name="user[first_name]" 
      id="user_first_name">
...