Master-X
Форум | Новости | Статьи
Главная » Форум » Программинг, Скрипты, Софт, Сервисы » 
Тема: Помогите с javascript и полями
цитата
05/09/10 в 17:14
 log
В общем есть поле:

Код:

<input name="fullimage" type="text" size="50" value="">


допустим в него вставлена ссылку на картинку типа:
http://mydomain.com/image.jpg

еще есть второе поле:

Код:

<input name="thumbinail-120x90" type="text" size="50" value="">


и ссылка:

Код:

<a href="#">120x90</a>


Т.е. Получается, что форма примерно такая (только ссылка на картинку может быть разной):

Код:

<input name="fullimage" type="text" size="50" value="http://mydomain.com/image.jpg"><br>

<a href="#">120x90</a><br>

<input name="thumbinail-120x90" type="text" size="50" value="">




Нужно, чтобы при нажатии на ссылку
Код:
<a href="#">120x90</a>

данные из поля fullimage копировались, а расширение ".jpg" заменялось на "-120x90.jpg"
и потом конечный результат вставлялся в поле thumbinail-120x90, т.е. получается туда должна вставиться ссылка типа:
http://mydomain.com/image-120x90.jpg


Помогите реализовать, всем рейт!
цитата
05/09/10 в 18:10
 Magistrator
чета типа того

<input id="fullimage" name="fullimage" type="text" size="50" value="http://mydomain.com/image.jpg"><br>

<a href="#" onclick="document.getElementById('thumbinail-120x90').value = document.getElementById

('fullimage').value.replace('.jpg', '-120x90.jpg');">120x90</a><br>

<input id="thumbinail-120x90" name="thumbinail-120x90" type="text" size="50" value="">

З. Ы.
в replace правильнее было бы regexp использовать.
цитата
05/09/10 в 18:22
 log
Спасибо, то что надо, оценил smail54.gif
цитата
05/09/10 в 18:33
 LeadFarmer
а я бы делал на jQ чтобы лишний код не воротить и на кроссбраузерность не попасть

<html>
<head>
<script type="text/javascript" src="./jquery-1.4.2.min.js"></script>
</head>
<script type="text/javascript">
   $(document).ready(function() {
      $(".resizer").click(function () {
         $('#thumbinail').val($('#fullimage').val().replace('.jpg', '-'+$(this).attr('id')+'.jpg'));
      });
    });
</script>
<body>
<input id="fullimage" name="fullimage" type="text" size="50" value="http://mydomain.com/image.jpg"><br>

<a class="resizer" id="120x90" href="#">120x90</a><br>
<a class="resizer" id="240x18" href="#">240x180</a><br>
<a class="resizer" id="360x270" href="#">360x270</a><br>

<input id="thumbinail" name="thumbinail" type="text" size="50" value="">

</body>
</html>
цитата
05/09/10 в 18:43
 leroy_17
<html>
<head>
<script>
function onClickLink( element )
{
   children = element.innerText;
   fullimage=document.getElementById('fullimage').value;
   pattern = /http\:\/\/(.+)\.(\w+)\/(\w+)\.jpg/i ;
   match1 = fullimage.match(pattern);
   
   if(  match1[3] != undefined )
   {
         document.getElementById('thumb').name = 'thumbinail-'+fullimage;
         document.getElementById('fullimage').value='';
         document.getElementById('fullimage').value = 'http://'+match1[1]+'.'+match1[2]+'/'+match1[3]+'-'+children+'.jpg'
   }
}
</script>
</head>
<body>
<form>
<input name="fullimage" type="text" id="fullimage" size="50" value="http://mydomain.com/image.jpg"><br>
<a href="#" onclick="onClickLink( this );">120x90</a><br>
<input name="thumbinail-120x9"  id="thumb" type="text" size="50" value="">
</form>
</body>
</html>

на голом JS если делать
цитата
06/09/10 в 12:01
 log
Спасибо, оценил всех +5!

есть еще вопрос...


К примеру вот форма:

Код:


Количество товаров:
<input type="text" id="product" name="product" />

Цена:
<input type="text" id="price" name="price" />

Цена за установку:
<input type="text" id="priceperadding" name="priceperadding" />

Итого:
<input type="text" id="pricetotal" name="pricetotal" />


нужно чтобы в поле "итого" (pricetotal) автоматически расчитывалось значение (в смысле я вбываю цифры, и ничего нажимать не надо все само расчитывается) по следующей формуле:

((product * price) / 100) + priceperadding

Последний раз редактировалось: log (06/09/10 в 12:42), всего редактировалось 1 раз
цитата
06/09/10 в 12:23
 Alexandur
Рискну предположить, что формула неправильная:
Код:
((product * price) / 100) + priceperadding
- должно быть так.

Тогда код:

<script type="text/javascript">
<!--
function pricetot()
{
   pricetotal.value = parseFloat((product.value * price.value) / 100) + parseFloat(priceperadding.value);
   return true;

}
//-->
</script>
  Количество товаров:
<input type="text" id="product" name="product" onkeyup="pricetot()" />

Цена:
<input type="text" id="price" name="price" onkeyup="pricetot()" />

Цена за установку:
<input type="text" id="priceperadding" name="priceperadding" onkeyup="pricetot()" />

Итого:
<input type="text" id="pricetotal" name="pricetotal" />
цитата
06/09/10 в 12:28
 LeadFarmer
тоже за то что формула кривая ) но у меня такой вариант

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<script type="text/javascript">
   $(document).ready(function() {
      $(".calculated").change(function () {
      var priceperadding = Number($('#priceperadding').val())
      var product = Number($('#product').val())
      var price = Number($('#price').val())
      var pricetotal = (price*product)+priceperadding
      $('#pricetotal').val(pricetotal);
      });
    });
</script>
<body>

Количество товаров:
<input type="text" class="calculated" id="product" name="product" /> <br>

Цена:
<input type="text" class="calculated" id="price" name="price" /> <br>

Цена за установку:
<input type="text" class="calculated" id="priceperadding" name="priceperadding" /> <br>

Итого:
<input type="text" id="pricetotal" name="pricetotal" />

</body>
</html>
цитата
06/09/10 в 12:49
 log
Спасибо, оценил +5, формула действительно была кривая (подправил ее).

Все отлично работает, только еще вопрос, а как округлить значение до целых?

т.е. чтобы было, например, не 539.7 а 540

и по коду у gimcnuk хотелось бы чтобы в случае если не все значения заполнены выводилось "0", а не "NaN"

у LeadFarmer работает так как надо, только смущает использование Код:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
цитата
06/09/10 в 12:56
 Alexandur

<script type="text/javascript">
<!--
function pricetot()
{
   var promejnost = parseFloat((product.value * price.value) / 100) + parseFloat(priceperadding.value);
   pricetotal.value = isNaN(promejnost)==true?0:parseInt(promejnost);
   return true;
}
//-->
</script>
цитата
06/09/10 в 12:59
 Alexandur
Jquery залей себе, много места не займёт.
Production (24KB, Minified and Gzipped)
Development (155KB, Uncompressed Code)

Хотя, на мой взгляд, для таких задач - это перебор. Гвозди микроскопом.
цитата
06/09/10 в 13:09
 log
Спс. еще +10!

Цитата:
Jquery залей себе, много места не займёт.


не люблю лишние файлы тыкать, а так реализовано отлично.

Всем еще раз спасибо!
цитата
06/09/10 в 13:42
 LeadFarmer
gimcnuk писал:
Хотя, на мой взгляд, для таких задач - это перебор. Гвозди микроскопом.

тут не соглашусь icon_cool.gif чем больше использую jq и другие fw тем меньше тянет лезть в голый js и прописывать всякие onmouseover, onmouseout-ы и проч.


Эта страница в полной версии