1. дома
  2. Вопрос и ответ
  3. Дайте каждое слово в <input> случайного цвета

Дайте каждое слово в <input> случайного цвета

2009-06-05 1 views

ответ

4

Я не думаю, что это возможно.

Вы можете накладывать текст поверх него, но вы попадаете на территорию thedailywtf.

источник

2009-06-05 07:16:05 Greg

5

Вы не можете изменить цвета текста внутри поля <input>. Однако вы можете создать DIV под ним или наложить его, как было предложено в предыдущем ответе.

Вот пример, который использует простой обычный Javascript.

<html> 
<head> 
<title>Random Colors</title> 
<script> 
window.onload = function(){ 
    var mytextbox = document.getElementById("mytext"); 
    mytextbox.onblur = function(){ 
    var words = mytextbox.value.split(' '); 
    var myDiv = document.getElementById("divText"); 
    myDiv.innerHTML = ''; 
    for(i = 0, len = words.length; i<len;i++){ 
     myDiv.innerHTML += '<span>' + words[i] + '</span>&nbsp;'; 
    } 
    var spans = myDiv.getElementsByTagName('span'); 
    for(i = 0, len = spans.length; i<len; i++){ 
     spans[i].style.color = random_color(); 
    } 
    } 
} 
function random_color() 
{ 
    var rint = Math.round(0xffffff * Math.random()); 
    return ('#0' + rint.toString(16)).replace(/^#0([0-9a-f]{6})$/i, '#$1'); 
} 
</script> 
</head> 
<body> 
<input type="text" id="mytext" /> 
<div id="divText"></div> 
</body> 
</html>

случайный цвет Функция Source

источник

2009-06-05 07:39:19

0

Вы можете использовать DIV вместо ввода.

Затем укажите свойства CSS, которые заставляют его смотреть.

И используйте свойство contentEditable для его редактирования (вещь HTML5, поддерживаемая современными браузерами и IE), если это позволяет ваша аудитория браузера.

Но тогда я думаю, вы должны построить что-то вроде богатого текстового редактора «а-ля» Google Docs, чтобы разрешить пользователям изменять цвета, которые будут гарантировать вам некоторые забавные рабочие часы;)

источник

2009-06-05 09:30:39 Mic

Смежные вопросы

 Смежные вопросы