Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   how? размер поля под размер содержимого (https://javascript.ru/forum/events/22471-how-razmer-polya-pod-razmer-soderzhimogo.html)

boJlb 21.10.2011 12:41
how? размер поля под размер содержимого
 
имеется следующее: для вывода результата в поле "Новый пароль" использован input. Вопрос: как сделать чтобы поле input меняло ширину в зависимости от выбранной длины пароля(8,10 и 12 символов)?
<HEAD >

<meta http-equiv="Content-Type" content="text/html; utf-8">

<SCRIPT LANGUAGE="JavaScript">



<!-- Begin

function getRandomNum(lbound, ubound) {

return (Math.floor(Math.random() * (ubound - lbound)) + lbound);

}

function getRandomChar() {

var numberChars = "0123456789";

var lowerChars = "abcdefghijklmnopqrstuvwxyz";

var upperChars = "Ø123456789abcdefghijkmnopqrstuvwxyzABCDEFGHÎJKL MNOPQRSTUVWXYZ";

var charSet = "";

charSet += upperChars;



return charSet.charAt(getRandomNum(0, charSet.length));

}



function getPassword(length) {



var rc = "";

if (length > 0)


for (var idx = 0; idx < length; ++idx) {

rc = rc + getRandomChar();



}

return rc;

}



// End -->

</script>


</HEAD>

<BODY>

<HTML><HEAD><TITLE>Многофункционал ные центры</TITLE>

<META http-equiv=Content-Type content="text/html; charset=utf-8">



<link rel="stylesheet" href="files/mfc.css" type="text/css">






<BODY background="files/modalpage_bg.gif" class ="bodystyle">





<TABLE border=0 width="100%">

<TR>

<TD vAlign=top align=center><IMG src="files/logo.GIF"> </TD>

</TR>

<TR>

<TD align=center><SPAN STYLE="font-size: 16pt">
Смена пароля для сотрудников СПбГУ "МФЦ"</SPAN>

<BR><SPAN class=titleversion></SPAN> &nbsp; <SPAN

title=""><IMG height=1 alt=""

src="files/working.GIF" width=1 border=0

name=Login_training_image_0></SPAN>

</TD>

</TR>

</TABLE>



</table>

</p>




<TABLE border=0 width="100%">

<TR>

<TD align=center><SPAN STYLE="font-size: 14pt">
<br><br>Для получения нового пароля нажмите на кнопку “Сгенерировать пароль”</br></br>
<br><PRE> 1.Запишите ваш новый пароль и введите в поля нового пароля и подтверждения</br>
<br> 2.Сброс пароля производится автоматически каждые 90дней</br>
<br> 3.Вход в МАИС МФЦ останется под первично полученным паролем</PRE></br>


</SPAN>

</TD>

</TR>

</TABLE>




<p align="center"><table class="listmfc">

<tr>



</tr>

</table>

</p>

</DIV>



</BODY></HTML>

<center>

<table width=80% border=0>

<tr align=center>

<td>

<form name="myform">

<table border=0>







<input type=button value="Сгенерировать пароль" onClick="document.myform.password.value =

getPassword(document.myform.passlength.value)" style="font-size: 20pt; font-family: Arial">









<br></br>

<td>

Новый пароль:



</td>


<td>



<input type=text READONLY name=password style="
font-size: 20px;
text-align:center;
border: none;
width: 135;
line-height: 30px;
height:30px;
">



</td>


<tr>

<td>

Длина пароля:

</td>

<td>
<select name="passlength">
<option value="8">8</option>
<option value="10">10</option>
<option value="12">12</option>
</select>


</td>

</tr>

</table>

</td>

</tr>

</table>

</center>

</BODY>

ЗЫ http://www.fayloobmennik.net/1090809 - ссылка на гиф для фона.

Триви 21.10.2011 14:01
А чо так много кода для такой простой задачи? :blink:

boJlb 21.10.2011 14:16
может я и написал чего лишнего) просто мой опыт не так велик^^
на данный момент мне необходимо решить вопрос именно с полем вывода "новый пароль"...чтобы его размер менялся в зависимости от выбранного параметра длины, а именно 8, 10 и 12 символов. А если еще и подскажете где я лишнего нагородил - так вообще счастью моему не будет предела:help:

Триви 21.10.2011 14:40
Накидал вам простенький примерчик.
Разберите его и на его основе сделайте отредактируйте свой код.

<input id='test' value='' size='1'/><span></span>

<script type='text/javascript'>
document.getElementById('test').onkeyup = function() {
  var len = this.value.length || 1
  this.setAttribute("size", len)
  this.setAttribute("maxlength", len+1)
  this.nextSibling.innerHTML = ' ' + len
}
</script>

boJlb 24.10.2011 17:59
спасибо), конечно не совсем то, что хотелось(изменение ширины инпута от селекта), но ладно) дописал сам...


Часовой пояс GMT +3, время: 12:03.